From 850ba91b954ed506806fbf3e0d0ddac6fe8a256a Mon Sep 17 00:00:00 2001
From: "slint-team[bot]" <175812618+slint-team[bot]@users.noreply.github.com>
Date: Fri, 8 Nov 2024 11:49:45 +0000
Subject: [PATCH] Update  from slint-ui/slint

Update tng docs from commit eac40399fdfa22fc96b674c41ab726ad6e050228 (refs/heads/docs-tng)
---
 snapshots/tng/404.html                        |   2 +-
 ...oisted.DO7nuvb1.js => hoisted.zHsgHwcm.js} |   4 +-
 ...slint-logo-square-dark.DwYyWyio_PgUok.webp | Bin 0 -> 3462 bytes
 ...nt-logo-square-light.H4H1qsfM_Z2spL2E.webp | Bin 0 -> 3716 bytes
 ...i-core.CbYEUlhU.js => ui-core.7kMo7JHm.js} |   2 +-
 snapshots/tng/elements/dialog/index.html      |   6 +-
 snapshots/tng/elements/flickable/index.html   |   6 +-
 snapshots/tng/elements/focusscope/index.html  |   6 +-
 snapshots/tng/elements/gridlayout/index.html  |   6 +-
 .../tng/elements/horizontallayout/index.html  |   6 +-
 snapshots/tng/elements/image/index.html       |   6 +-
 snapshots/tng/elements/path/index.html        |   6 +-
 snapshots/tng/elements/popupwindow/index.html |   6 +-
 snapshots/tng/elements/rectangle/index.html   |   6 +-
 .../elements/swipegestrurehandler/index.html  |   6 +-
 snapshots/tng/elements/text/index.html        |   6 +-
 snapshots/tng/elements/textinput/index.html   |   6 +-
 snapshots/tng/elements/timer/index.html       |   6 +-
 snapshots/tng/elements/toucharea/index.html   |   6 +-
 .../tng/elements/verticallayout/index.html    |   6 +-
 snapshots/tng/elements/window/index.html      |   6 +-
 .../tng/getting-started/intro/index.html      |  13 +-
 .../getting-started/which_language/index.html |   6 +-
 snapshots/tng/guide/animation/index.html      |   9 +-
 snapshots/tng/guide/basics/index.html         |   6 +-
 snapshots/tng/guide/components/index.html     |   6 +-
 snapshots/tng/guide/container/index.html      |  95 +++++++
 snapshots/tng/guide/file/index.html           | 111 +++++++++
 snapshots/tng/guide/focus/index.html          | 103 ++++++++
 snapshots/tng/guide/fonts/index.html          |  96 +++++++
 snapshots/tng/guide/functions/index.html      |   9 +-
 snapshots/tng/guide/intro/index.html          |   6 +-
 snapshots/tng/guide/layouting/index.html      | 234 ++++++++++++++++++
 snapshots/tng/guide/layouts/index.html        |   6 +-
 snapshots/tng/guide/preview/index.html        |   6 +-
 snapshots/tng/guide/purity/index.html         | 105 ++++++++
 snapshots/tng/guide/reactive/index.html       |   6 +-
 snapshots/tng/guide/states/index.html         |   6 +-
 snapshots/tng/guide/translations/index.html   | 202 +++++++++++++++
 snapshots/tng/guide/types/index.html          |   6 +-
 snapshots/tng/index.html                      |   4 +-
 snapshots/tng/overview/index.html             |  93 +++++++
 .../pagefind/fragment/en_19213a8.pf_fragment  | Bin 0 -> 688 bytes
 ...e82.pf_fragment => en_2182992.pf_fragment} | Bin 1717 -> 1716 bytes
 .../pagefind/fragment/en_22b12ae.pf_fragment  | Bin 0 -> 1546 bytes
 .../pagefind/fragment/en_279378d.pf_fragment  | Bin 0 -> 919 bytes
 .../pagefind/fragment/en_2d97661.pf_fragment  | Bin 0 -> 1288 bytes
 .../pagefind/fragment/en_336e99f.pf_fragment  | Bin 1496 -> 0 bytes
 .../pagefind/fragment/en_429a71b.pf_fragment  | Bin 0 -> 415 bytes
 .../pagefind/fragment/en_4647333.pf_fragment  | Bin 1943 -> 0 bytes
 .../pagefind/fragment/en_4742949.pf_fragment  | Bin 800 -> 0 bytes
 .../pagefind/fragment/en_4e7dca2.pf_fragment  | Bin 244 -> 0 bytes
 .../pagefind/fragment/en_568eb76.pf_fragment  | Bin 510 -> 0 bytes
 .../pagefind/fragment/en_6b55552.pf_fragment  | Bin 0 -> 3678 bytes
 .../pagefind/fragment/en_7829dc4.pf_fragment  | Bin 0 -> 711 bytes
 .../pagefind/fragment/en_7c3613c.pf_fragment  | Bin 0 -> 1349 bytes
 .../pagefind/fragment/en_826ff3d.pf_fragment  | Bin 2226 -> 0 bytes
 ...68a.pf_fragment => en_881485f.pf_fragment} | Bin 2066 -> 2066 bytes
 .../pagefind/fragment/en_8838b7b.pf_fragment  | Bin 1287 -> 0 bytes
 .../pagefind/fragment/en_9a47fe7.pf_fragment  | Bin 0 -> 3259 bytes
 .../pagefind/fragment/en_9aa3b2e.pf_fragment  | Bin 0 -> 1942 bytes
 .../pagefind/fragment/en_a977354.pf_fragment  | Bin 0 -> 243 bytes
 .../pagefind/fragment/en_bbab658.pf_fragment  | Bin 0 -> 1498 bytes
 .../pagefind/fragment/en_bd3f722.pf_fragment  | Bin 0 -> 848 bytes
 ...278.pf_fragment => en_befba3d.pf_fragment} | Bin 870 -> 869 bytes
 .../pagefind/fragment/en_cbe0403.pf_fragment  | Bin 0 -> 509 bytes
 .../pagefind/fragment/en_ce2dcd3.pf_fragment  | Bin 814 -> 0 bytes
 .../pagefind/fragment/en_d045d09.pf_fragment  | Bin 0 -> 802 bytes
 .../pagefind/fragment/en_d2367dd.pf_fragment  | Bin 0 -> 897 bytes
 ...e35.pf_fragment => en_d87abe4.pf_fragment} | Bin 1341 -> 1341 bytes
 .../pagefind/fragment/en_dc70e86.pf_fragment  | Bin 1546 -> 0 bytes
 .../pagefind/fragment/en_e17bec1.pf_fragment  | Bin 1035 -> 0 bytes
 .../pagefind/fragment/en_f1f9a50.pf_fragment  | Bin 0 -> 560 bytes
 .../pagefind/fragment/en_f78c780.pf_fragment  | Bin 0 -> 2221 bytes
 .../tng/pagefind/index/en_1535f45.pf_index    | Bin 0 -> 9620 bytes
 .../tng/pagefind/index/en_179f1fd.pf_index    | Bin 0 -> 34706 bytes
 .../tng/pagefind/index/en_30161fd.pf_index    | Bin 0 -> 35900 bytes
 .../tng/pagefind/index/en_8826db1.pf_index    | Bin 34913 -> 0 bytes
 .../tng/pagefind/index/en_e0362a6.pf_index    | Bin 31912 -> 0 bytes
 snapshots/tng/pagefind/pagefind-entry.json    |   2 +-
 .../pagefind/pagefind.en_95c3957d2c.pf_meta   | Bin 0 -> 650 bytes
 .../pagefind/pagefind.en_fba963f199.pf_meta   | Bin 568 -> 0 bytes
 snapshots/tng/sitemap-0.xml                   |   2 +-
 .../tng/std-widgets/aboutslint/index.html     |   6 +-
 snapshots/tng/std-widgets/button/index.html   |   6 +-
 snapshots/tng/std-widgets/checkbox/index.html |   6 +-
 snapshots/tng/std-widgets/combobox/index.html |   6 +-
 .../tng/std-widgets/datepicker/index.html     |   6 +-
 snapshots/tng/std-widgets/gridbox/index.html  |   6 +-
 snapshots/tng/std-widgets/groupbox/index.html |   6 +-
 .../tng/std-widgets/horizontalbox/index.html  |   6 +-
 snapshots/tng/std-widgets/lineedit/index.html |   6 +-
 snapshots/tng/std-widgets/listview/index.html |   6 +-
 snapshots/tng/std-widgets/overview/index.html |   6 +-
 .../std-widgets/progressindicator/index.html  |   6 +-
 .../tng/std-widgets/scrollview/index.html     |   6 +-
 snapshots/tng/std-widgets/slider/index.html   |   6 +-
 snapshots/tng/std-widgets/spinbox/index.html  |   6 +-
 snapshots/tng/std-widgets/spinner/index.html  |   6 +-
 .../tng/std-widgets/standardbutton/index.html |   6 +-
 .../std-widgets/standardlistview/index.html   |   6 +-
 .../std-widgets/standardtableview/index.html  |   6 +-
 snapshots/tng/std-widgets/switch/index.html   |   6 +-
 .../tng/std-widgets/tabwidget/index.html      |   6 +-
 snapshots/tng/std-widgets/textedit/index.html |  34 ++-
 .../tng/std-widgets/timepicker/index.html     |   6 +-
 .../tng/std-widgets/verticalbox/index.html    |  10 +-
 snapshots/tng/tutorial/conclusion/index.html  |   6 +-
 .../tutorial/creating_the_tiles/index.html    |   6 +-
 .../from_one_to_multiple_tiles/index.html     |   6 +-
 snapshots/tng/tutorial/game_logic/index.html  |   6 +-
 .../tng/tutorial/getting_started/index.html   |   6 +-
 .../tutorial/ideas_for_the_reader/index.html  |   6 +-
 snapshots/tng/tutorial/memory_tile/index.html |   6 +-
 .../tutorial/polishing_the_tile/index.html    |   6 +-
 snapshots/tng/tutorial/quickstart/index.html  |   6 +-
 .../tutorial/running_in_a_browser/index.html  |   6 +-
 117 files changed, 1262 insertions(+), 210 deletions(-)
 rename snapshots/tng/_astro/{hoisted.DO7nuvb1.js => hoisted.zHsgHwcm.js} (59%)
 create mode 100644 snapshots/tng/_astro/slint-logo-square-dark.DwYyWyio_PgUok.webp
 create mode 100644 snapshots/tng/_astro/slint-logo-square-light.H4H1qsfM_Z2spL2E.webp
 rename snapshots/tng/_astro/{ui-core.CbYEUlhU.js => ui-core.7kMo7JHm.js} (99%)
 create mode 100644 snapshots/tng/guide/container/index.html
 create mode 100644 snapshots/tng/guide/file/index.html
 create mode 100644 snapshots/tng/guide/focus/index.html
 create mode 100644 snapshots/tng/guide/fonts/index.html
 create mode 100644 snapshots/tng/guide/layouting/index.html
 create mode 100644 snapshots/tng/guide/purity/index.html
 create mode 100644 snapshots/tng/guide/translations/index.html
 create mode 100644 snapshots/tng/overview/index.html
 create mode 100644 snapshots/tng/pagefind/fragment/en_19213a8.pf_fragment
 rename snapshots/tng/pagefind/fragment/{en_2ed3e82.pf_fragment => en_2182992.pf_fragment} (81%)
 create mode 100644 snapshots/tng/pagefind/fragment/en_22b12ae.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_279378d.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_2d97661.pf_fragment
 delete mode 100644 snapshots/tng/pagefind/fragment/en_336e99f.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_429a71b.pf_fragment
 delete mode 100644 snapshots/tng/pagefind/fragment/en_4647333.pf_fragment
 delete mode 100644 snapshots/tng/pagefind/fragment/en_4742949.pf_fragment
 delete mode 100644 snapshots/tng/pagefind/fragment/en_4e7dca2.pf_fragment
 delete mode 100644 snapshots/tng/pagefind/fragment/en_568eb76.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_6b55552.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_7829dc4.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_7c3613c.pf_fragment
 delete mode 100644 snapshots/tng/pagefind/fragment/en_826ff3d.pf_fragment
 rename snapshots/tng/pagefind/fragment/{en_62b368a.pf_fragment => en_881485f.pf_fragment} (84%)
 delete mode 100644 snapshots/tng/pagefind/fragment/en_8838b7b.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_9a47fe7.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_9aa3b2e.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_a977354.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_bbab658.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_bd3f722.pf_fragment
 rename snapshots/tng/pagefind/fragment/{en_b45f278.pf_fragment => en_befba3d.pf_fragment} (83%)
 create mode 100644 snapshots/tng/pagefind/fragment/en_cbe0403.pf_fragment
 delete mode 100644 snapshots/tng/pagefind/fragment/en_ce2dcd3.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_d045d09.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_d2367dd.pf_fragment
 rename snapshots/tng/pagefind/fragment/{en_43f9e35.pf_fragment => en_d87abe4.pf_fragment} (78%)
 delete mode 100644 snapshots/tng/pagefind/fragment/en_dc70e86.pf_fragment
 delete mode 100644 snapshots/tng/pagefind/fragment/en_e17bec1.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_f1f9a50.pf_fragment
 create mode 100644 snapshots/tng/pagefind/fragment/en_f78c780.pf_fragment
 create mode 100644 snapshots/tng/pagefind/index/en_1535f45.pf_index
 create mode 100644 snapshots/tng/pagefind/index/en_179f1fd.pf_index
 create mode 100644 snapshots/tng/pagefind/index/en_30161fd.pf_index
 delete mode 100644 snapshots/tng/pagefind/index/en_8826db1.pf_index
 delete mode 100644 snapshots/tng/pagefind/index/en_e0362a6.pf_index
 create mode 100644 snapshots/tng/pagefind/pagefind.en_95c3957d2c.pf_meta
 delete mode 100644 snapshots/tng/pagefind/pagefind.en_fba963f199.pf_meta

diff --git a/snapshots/tng/404.html b/snapshots/tng/404.html
index d07e405b4..f5def6d30 100644
--- a/snapshots/tng/404.html
+++ b/snapshots/tng/404.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
diff --git a/snapshots/tng/_astro/hoisted.DO7nuvb1.js b/snapshots/tng/_astro/hoisted.zHsgHwcm.js
similarity index 59%
rename from snapshots/tng/_astro/hoisted.DO7nuvb1.js
rename to snapshots/tng/_astro/hoisted.zHsgHwcm.js
index 22790cfe3..5dd199c5b 100644
--- a/snapshots/tng/_astro/hoisted.DO7nuvb1.js
+++ b/snapshots/tng/_astro/hoisted.zHsgHwcm.js
@@ -1,2 +1,2 @@
-const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["_astro/ui-core.CbYEUlhU.js","_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js"])))=>i.map(i=>d[i]);
-import"./Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js";const S=document.getElementById("starlight__sidebar"),y=S?.querySelector("sl-sidebar-state-persist"),b="sl-sidebar-state",v=()=>{let t=[];const e=y?.dataset.hash||"";try{const n=sessionStorage.getItem(b),s=JSON.parse(n||"{}");Array.isArray(s.open)&&s.hash===e&&(t=s.open)}catch{}return{hash:e,open:t,scroll:S?.scrollTop||0}},w=t=>{try{sessionStorage.setItem(b,JSON.stringify(t))}catch{}},L=()=>w(v()),x=(t,e)=>{const n=v();n.open[e]=t,w(n)};y?.addEventListener("click",t=>{if(!(t.target instanceof Element))return;const e=t.target.closest("summary")?.closest("details");if(!e)return;const n=e.querySelector("sl-sidebar-restore"),s=parseInt(n?.dataset.index||"");isNaN(s)||x(!e.open,s)});addEventListener("visibilitychange",()=>{document.visibilityState==="hidden"&&L()});addEventListener("pageHide",L);class H extends HTMLElement{constructor(){super();const e=this.querySelector("select");e&&e.addEventListener("change",n=>{n.currentTarget instanceof HTMLSelectElement&&(window.location.pathname=n.currentTarget.value)})}}customElements.define("starlight-lang-select",H);const C="modulepreload",M=function(t){return"/tng/"+t},E={},_=function(e,n,s){let u=Promise.resolve();if(n&&n.length>0){document.getElementsByTagName("link");const a=document.querySelector("meta[property=csp-nonce]"),c=a?.nonce||a?.getAttribute("nonce");u=Promise.allSettled(n.map(l=>{if(l=M(l),l in E)return;E[l]=!0;const r=l.endsWith(".css"),h=r?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${l}"]${h}`))return;const i=document.createElement("link");if(i.rel=r?"stylesheet":C,r||(i.as="script"),i.crossOrigin="",i.href=l,c&&i.setAttribute("nonce",c),document.head.appendChild(i),r)return new Promise((o,m)=>{i.addEventListener("load",o),i.addEventListener("error",()=>m(new Error(`Unable to preload CSS for ${l}`)))})}))}function d(a){const c=new Event("vite:preloadError",{cancelable:!0});if(c.payload=a,window.dispatchEvent(c),!c.defaultPrevented)throw a}return u.then(a=>{for(const c of a||[])c.status==="rejected"&&d(c.reason);return e().catch(d)})};class A extends HTMLElement{constructor(){super();const e=this.querySelector("button[data-open-modal]"),n=this.querySelector("button[data-close-modal]"),s=this.querySelector("dialog"),u=this.querySelector(".dialog-frame"),d=o=>{("href"in(o.target||{})||document.body.contains(o.target)&&!u.contains(o.target))&&c()},a=o=>{s.showModal(),document.body.toggleAttribute("data-search-modal-open",!0),this.querySelector("input")?.focus(),o?.stopPropagation(),window.addEventListener("click",d)},c=()=>s.close();e.addEventListener("click",a),e.disabled=!1,n.addEventListener("click",c),s.addEventListener("close",()=>{document.body.toggleAttribute("data-search-modal-open",!1),window.removeEventListener("click",d)}),window.addEventListener("keydown",o=>{(o.metaKey===!0||o.ctrlKey===!0)&&o.key==="k"&&(s.open?c():a(),o.preventDefault())});let l={};try{l=JSON.parse(this.dataset.translations||"{}")}catch{}const i=this.dataset.stripTrailingSlash!==void 0?o=>o.replace(/(.)\/(#.*)?$/,"$1$2"):o=>o;window.addEventListener("DOMContentLoaded",()=>{(window.requestIdleCallback||(m=>setTimeout(m,1)))(async()=>{const{PagefindUI:m}=await _(async()=>{const{PagefindUI:g}=await import("./ui-core.CbYEUlhU.js");return{PagefindUI:g}},__vite__mapDeps([0,1]));new m({element:"#starlight__search",baseUrl:"/tng",bundlePath:"/tng".replace(/\/$/,"")+"/pagefind/",showImages:!1,translations:l,showSubResults:!0,processResult:g=>{g.url=i(g.url),g.sub_results=g.sub_results.map(f=>(f.url=i(f.url),f))}})})})}}customElements.define("site-search",A);const T="starlight-theme",k=t=>t==="auto"||t==="dark"||t==="light"?t:"auto",I=()=>k(typeof localStorage<"u"&&localStorage.getItem(T));function P(t){typeof localStorage<"u"&&localStorage.setItem(T,t==="light"||t==="dark"?t:"")}const O=()=>matchMedia("(prefers-color-scheme: light)").matches?"light":"dark";function p(t){StarlightThemeProvider.updatePickers(t),document.documentElement.dataset.theme=t==="auto"?O():t,P(t)}matchMedia("(prefers-color-scheme: light)").addEventListener("change",()=>{I()==="auto"&&p("auto")});class R extends HTMLElement{constructor(){super(),p(I()),this.querySelector("select")?.addEventListener("change",e=>{e.currentTarget instanceof HTMLSelectElement&&p(k(e.currentTarget.value))})}}customElements.define("starlight-theme-select",R);class N extends HTMLElement{constructor(){super(),this.btn=this.querySelector("button"),this.btn.addEventListener("click",()=>this.toggleExpanded());const e=this.closest("nav");e&&e.addEventListener("keyup",n=>this.closeOnEscape(n))}setExpanded(e){this.setAttribute("aria-expanded",String(e)),document.body.toggleAttribute("data-mobile-menu-expanded",e)}toggleExpanded(){this.setExpanded(this.getAttribute("aria-expanded")!=="true")}closeOnEscape(e){e.code==="Escape"&&(this.setExpanded(!1),this.btn.focus())}}customElements.define("starlight-menu-button",N);const $="_top";class q extends HTMLElement{constructor(){super(),this._current=this.querySelector('a[aria-current="true"]'),this.minH=parseInt(this.dataset.minH||"2",10),this.maxH=parseInt(this.dataset.maxH||"3",10),this.onIdle=e=>(window.requestIdleCallback||(n=>setTimeout(n,1)))(e),this.init=()=>{const e=[...this.querySelectorAll("a")],n=r=>{if(r instanceof HTMLHeadingElement){if(r.id===$)return!0;const h=r.tagName[1];if(h){const i=parseInt(h,10);if(i>=this.minH&&i<=this.maxH)return!0}}return!1},s=r=>{if(!r)return null;const h=r;for(;r;){if(n(r))return r;for(r=r.previousElementSibling;r?.lastElementChild;)r=r.lastElementChild;const i=s(r);if(i)return i}return s(h.parentElement)},u=r=>{for(const{isIntersecting:h,target:i}of r){if(!h)continue;const o=s(i);if(!o)continue;const m=e.find(g=>g.hash==="#"+encodeURIComponent(o.id));if(m){this.current=m;break}}},d=document.querySelectorAll("main [id], main [id] ~ *, main .content > *");let a;const c=()=>{a||(a=new IntersectionObserver(u,{rootMargin:this.getRootMargin()}),d.forEach(r=>a.observe(r)))};c();let l;window.addEventListener("resize",()=>{a&&(a.disconnect(),a=void 0),clearTimeout(l),l=setTimeout(()=>this.onIdle(c),200)})},this.onIdle(()=>this.init())}set current(e){e!==this._current&&(this._current&&this._current.removeAttribute("aria-current"),e.setAttribute("aria-current","true"),this._current=e)}getRootMargin(){const e=document.querySelector("header")?.getBoundingClientRect().height||0,n=this.querySelector("summary")?.getBoundingClientRect().height||0,s=e+n+32,u=s+53,d=document.documentElement.clientHeight;return`-${s}px 0% ${u-d}px`}}customElements.define("starlight-toc",q);class B extends q{set current(e){super.current=e;const n=this.querySelector(".display-current");n&&(n.textContent=e.textContent)}constructor(){super();const e=this.querySelector("details");if(!e)return;const n=()=>{e.open=!1};e.querySelectorAll("a").forEach(s=>{s.addEventListener("click",n)}),window.addEventListener("click",s=>{e.contains(s.target)||n()}),window.addEventListener("keydown",s=>{if(s.key==="Escape"&&e.open){const u=e.contains(document.activeElement);if(n(),u){const d=e.querySelector("summary");d&&d.focus()}}})}}customElements.define("mobile-starlight-toc",B);export{_};
+const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["_astro/ui-core.7kMo7JHm.js","_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js"])))=>i.map(i=>d[i]);
+import"./Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js";const S=document.getElementById("starlight__sidebar"),y=S?.querySelector("sl-sidebar-state-persist"),b="sl-sidebar-state",v=()=>{let t=[];const e=y?.dataset.hash||"";try{const n=sessionStorage.getItem(b),s=JSON.parse(n||"{}");Array.isArray(s.open)&&s.hash===e&&(t=s.open)}catch{}return{hash:e,open:t,scroll:S?.scrollTop||0}},w=t=>{try{sessionStorage.setItem(b,JSON.stringify(t))}catch{}},L=()=>w(v()),x=(t,e)=>{const n=v();n.open[e]=t,w(n)};y?.addEventListener("click",t=>{if(!(t.target instanceof Element))return;const e=t.target.closest("summary")?.closest("details");if(!e)return;const n=e.querySelector("sl-sidebar-restore"),s=parseInt(n?.dataset.index||"");isNaN(s)||x(!e.open,s)});addEventListener("visibilitychange",()=>{document.visibilityState==="hidden"&&L()});addEventListener("pageHide",L);class H extends HTMLElement{constructor(){super();const e=this.querySelector("select");e&&e.addEventListener("change",n=>{n.currentTarget instanceof HTMLSelectElement&&(window.location.pathname=n.currentTarget.value)})}}customElements.define("starlight-lang-select",H);const C="modulepreload",M=function(t){return"/tng/"+t},E={},_=function(e,n,s){let u=Promise.resolve();if(n&&n.length>0){document.getElementsByTagName("link");const a=document.querySelector("meta[property=csp-nonce]"),c=a?.nonce||a?.getAttribute("nonce");u=Promise.allSettled(n.map(l=>{if(l=M(l),l in E)return;E[l]=!0;const r=l.endsWith(".css"),h=r?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${l}"]${h}`))return;const i=document.createElement("link");if(i.rel=r?"stylesheet":C,r||(i.as="script"),i.crossOrigin="",i.href=l,c&&i.setAttribute("nonce",c),document.head.appendChild(i),r)return new Promise((o,m)=>{i.addEventListener("load",o),i.addEventListener("error",()=>m(new Error(`Unable to preload CSS for ${l}`)))})}))}function d(a){const c=new Event("vite:preloadError",{cancelable:!0});if(c.payload=a,window.dispatchEvent(c),!c.defaultPrevented)throw a}return u.then(a=>{for(const c of a||[])c.status==="rejected"&&d(c.reason);return e().catch(d)})};class A extends HTMLElement{constructor(){super();const e=this.querySelector("button[data-open-modal]"),n=this.querySelector("button[data-close-modal]"),s=this.querySelector("dialog"),u=this.querySelector(".dialog-frame"),d=o=>{("href"in(o.target||{})||document.body.contains(o.target)&&!u.contains(o.target))&&c()},a=o=>{s.showModal(),document.body.toggleAttribute("data-search-modal-open",!0),this.querySelector("input")?.focus(),o?.stopPropagation(),window.addEventListener("click",d)},c=()=>s.close();e.addEventListener("click",a),e.disabled=!1,n.addEventListener("click",c),s.addEventListener("close",()=>{document.body.toggleAttribute("data-search-modal-open",!1),window.removeEventListener("click",d)}),window.addEventListener("keydown",o=>{(o.metaKey===!0||o.ctrlKey===!0)&&o.key==="k"&&(s.open?c():a(),o.preventDefault())});let l={};try{l=JSON.parse(this.dataset.translations||"{}")}catch{}const i=this.dataset.stripTrailingSlash!==void 0?o=>o.replace(/(.)\/(#.*)?$/,"$1$2"):o=>o;window.addEventListener("DOMContentLoaded",()=>{(window.requestIdleCallback||(m=>setTimeout(m,1)))(async()=>{const{PagefindUI:m}=await _(async()=>{const{PagefindUI:g}=await import("./ui-core.7kMo7JHm.js");return{PagefindUI:g}},__vite__mapDeps([0,1]));new m({element:"#starlight__search",baseUrl:"/tng",bundlePath:"/tng".replace(/\/$/,"")+"/pagefind/",showImages:!1,translations:l,showSubResults:!0,processResult:g=>{g.url=i(g.url),g.sub_results=g.sub_results.map(f=>(f.url=i(f.url),f))}})})})}}customElements.define("site-search",A);const T="starlight-theme",k=t=>t==="auto"||t==="dark"||t==="light"?t:"auto",I=()=>k(typeof localStorage<"u"&&localStorage.getItem(T));function P(t){typeof localStorage<"u"&&localStorage.setItem(T,t==="light"||t==="dark"?t:"")}const O=()=>matchMedia("(prefers-color-scheme: light)").matches?"light":"dark";function p(t){StarlightThemeProvider.updatePickers(t),document.documentElement.dataset.theme=t==="auto"?O():t,P(t)}matchMedia("(prefers-color-scheme: light)").addEventListener("change",()=>{I()==="auto"&&p("auto")});class R extends HTMLElement{constructor(){super(),p(I()),this.querySelector("select")?.addEventListener("change",e=>{e.currentTarget instanceof HTMLSelectElement&&p(k(e.currentTarget.value))})}}customElements.define("starlight-theme-select",R);const N="_top";class q extends HTMLElement{constructor(){super(),this._current=this.querySelector('a[aria-current="true"]'),this.minH=parseInt(this.dataset.minH||"2",10),this.maxH=parseInt(this.dataset.maxH||"3",10),this.onIdle=e=>(window.requestIdleCallback||(n=>setTimeout(n,1)))(e),this.init=()=>{const e=[...this.querySelectorAll("a")],n=r=>{if(r instanceof HTMLHeadingElement){if(r.id===N)return!0;const h=r.tagName[1];if(h){const i=parseInt(h,10);if(i>=this.minH&&i<=this.maxH)return!0}}return!1},s=r=>{if(!r)return null;const h=r;for(;r;){if(n(r))return r;for(r=r.previousElementSibling;r?.lastElementChild;)r=r.lastElementChild;const i=s(r);if(i)return i}return s(h.parentElement)},u=r=>{for(const{isIntersecting:h,target:i}of r){if(!h)continue;const o=s(i);if(!o)continue;const m=e.find(g=>g.hash==="#"+encodeURIComponent(o.id));if(m){this.current=m;break}}},d=document.querySelectorAll("main [id], main [id] ~ *, main .content > *");let a;const c=()=>{a||(a=new IntersectionObserver(u,{rootMargin:this.getRootMargin()}),d.forEach(r=>a.observe(r)))};c();let l;window.addEventListener("resize",()=>{a&&(a.disconnect(),a=void 0),clearTimeout(l),l=setTimeout(()=>this.onIdle(c),200)})},this.onIdle(()=>this.init())}set current(e){e!==this._current&&(this._current&&this._current.removeAttribute("aria-current"),e.setAttribute("aria-current","true"),this._current=e)}getRootMargin(){const e=document.querySelector("header")?.getBoundingClientRect().height||0,n=this.querySelector("summary")?.getBoundingClientRect().height||0,s=e+n+32,u=s+53,d=document.documentElement.clientHeight;return`-${s}px 0% ${u-d}px`}}customElements.define("starlight-toc",q);class $ extends q{set current(e){super.current=e;const n=this.querySelector(".display-current");n&&(n.textContent=e.textContent)}constructor(){super();const e=this.querySelector("details");if(!e)return;const n=()=>{e.open=!1};e.querySelectorAll("a").forEach(s=>{s.addEventListener("click",n)}),window.addEventListener("click",s=>{e.contains(s.target)||n()}),window.addEventListener("keydown",s=>{if(s.key==="Escape"&&e.open){const u=e.contains(document.activeElement);if(n(),u){const d=e.querySelector("summary");d&&d.focus()}}})}}customElements.define("mobile-starlight-toc",$);class B extends HTMLElement{constructor(){super(),this.btn=this.querySelector("button"),this.btn.addEventListener("click",()=>this.toggleExpanded());const e=this.closest("nav");e&&e.addEventListener("keyup",n=>this.closeOnEscape(n))}setExpanded(e){this.setAttribute("aria-expanded",String(e)),document.body.toggleAttribute("data-mobile-menu-expanded",e)}toggleExpanded(){this.setExpanded(this.getAttribute("aria-expanded")!=="true")}closeOnEscape(e){e.code==="Escape"&&(this.setExpanded(!1),this.btn.focus())}}customElements.define("starlight-menu-button",B);export{_};
diff --git a/snapshots/tng/_astro/slint-logo-square-dark.DwYyWyio_PgUok.webp b/snapshots/tng/_astro/slint-logo-square-dark.DwYyWyio_PgUok.webp
new file mode 100644
index 0000000000000000000000000000000000000000..8888ad84decac1a580db0413e668c0e401e3d5c2
GIT binary patch
literal 3462
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

literal 0
HcmV?d00001

diff --git a/snapshots/tng/_astro/slint-logo-square-light.H4H1qsfM_Z2spL2E.webp b/snapshots/tng/_astro/slint-logo-square-light.H4H1qsfM_Z2spL2E.webp
new file mode 100644
index 0000000000000000000000000000000000000000..ea9f57c6f2aa5eff20d83d3fa35665cc8cbf228f
GIT binary patch
literal 3716
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

literal 0
HcmV?d00001

diff --git a/snapshots/tng/_astro/ui-core.CbYEUlhU.js b/snapshots/tng/_astro/ui-core.7kMo7JHm.js
similarity index 99%
rename from snapshots/tng/_astro/ui-core.CbYEUlhU.js
rename to snapshots/tng/_astro/ui-core.7kMo7JHm.js
index f0d6fe26b..0749b4b70 100644
--- a/snapshots/tng/_astro/ui-core.CbYEUlhU.js
+++ b/snapshots/tng/_astro/ui-core.7kMo7JHm.js
@@ -1,2 +1,2 @@
-import{_ as Js}from"./hoisted.DO7nuvb1.js";import"./Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js";var Ws=Object.defineProperty,k=(e,t)=>{for(var u in t)Ws(e,u,{get:t[u],enumerable:!0})};function P(){}function hu(e){return e()}function Ne(){return Object.create(null)}function W(e){e.forEach(hu)}function mu(e){return typeof e=="function"}function fe(e,t){return e!=e?t==t:e!==t||e&&typeof e=="object"||typeof e=="function"}var oe;function ce(e,t){return oe||(oe=document.createElement("a")),oe.href=t,e===oe.href}function Zs(e){return Object.keys(e).length===0}function A(e,t){e.appendChild(t)}function T(e,t,u){e.insertBefore(t,u||null)}function v(e){e.parentNode&&e.parentNode.removeChild(e)}function ie(e,t){for(let u=0;u<e.length;u+=1)e[u]&&e[u].d(t)}function p(e){return document.createElement(e)}function Ys(e){return document.createElementNS("http://www.w3.org/2000/svg",e)}function S(e){return document.createTextNode(e)}function M(){return S(" ")}function ee(){return S("")}function G(e,t,u,r){return e.addEventListener(t,u,r),()=>e.removeEventListener(t,u,r)}function g(e,t,u){u==null?e.removeAttribute(t):e.getAttribute(t)!==u&&e.setAttribute(t,u)}function Xs(e){return Array.from(e.childNodes)}function j(e,t){t=""+t,e.data!==t&&(e.data=t)}function ze(e,t){e.value=t??""}function K(e,t,u){e.classList[u?"add":"remove"](t)}var Qs=class{constructor(e=!1){this.is_svg=!1,this.is_svg=e,this.e=this.n=null}c(e){this.h(e)}m(e,t,u=null){this.e||(this.is_svg?this.e=Ys(t.nodeName):this.e=p(t.nodeType===11?"TEMPLATE":t.nodeName),this.t=t.tagName!=="TEMPLATE"?t:t.content,this.c(e)),this.i(u)}h(e){this.e.innerHTML=e,this.n=Array.from(this.e.nodeName==="TEMPLATE"?this.e.content.childNodes:this.e.childNodes)}i(e){for(let t=0;t<this.n.length;t+=1)T(this.t,this.n[t],e)}p(e){this.d(),this.h(e),this.i(this.a)}d(){this.n.forEach(v)}},se;function re(e){se=e}function Cu(){if(!se)throw new Error("Function called outside component initialization");return se}function $s(e){Cu().$$.on_mount.push(e)}function el(e){Cu().$$.on_destroy.push(e)}var X=[],le=[],$=[],pe=[],ul=Promise.resolve(),ve=!1;function tl(){ve||(ve=!0,ul.then(gu))}function Te(e){$.push(e)}function rl(e){pe.push(e)}var Ae=new Set,Y=0;function gu(){if(Y!==0)return;const e=se;do{try{for(;Y<X.length;){const t=X[Y];Y++,re(t),sl(t.$$)}}catch(t){throw X.length=0,Y=0,t}for(re(null),X.length=0,Y=0;le.length;)le.pop()();for(let t=0;t<$.length;t+=1){const u=$[t];Ae.has(u)||(Ae.add(u),u())}$.length=0}while(X.length);for(;pe.length;)pe.pop()();ve=!1,Ae.clear(),re(e)}function sl(e){if(e.fragment!==null){e.update(),W(e.before_update);const t=e.dirty;e.dirty=[-1],e.fragment&&e.fragment.p(e.ctx,t),e.after_update.forEach(Te)}}function ll(e){const t=[],u=[];$.forEach(r=>e.indexOf(r)===-1?t.push(r):u.push(r)),u.forEach(r=>r()),$=t}var _e=new Set,J;function ae(){J={r:0,c:[],p:J}}function ne(){J.r||W(J.c),J=J.p}function z(e,t){e&&e.i&&(_e.delete(e),e.i(t))}function U(e,t,u,r){if(e&&e.o){if(_e.has(e))return;_e.add(e),J.c.push(()=>{_e.delete(e),r&&(u&&e.d(1),r())}),e.o(t)}else r&&r()}function al(e,t){U(e,1,1,()=>{t.delete(e.key)})}function nl(e,t,u,r,s,l,a,n,i,d,_,h){let m=e.length,f=l.length,c=m;const o={};for(;c--;)o[e[c].key]=c;const E=[],B=new Map,R=new Map,F=[];for(c=f;c--;){const b=h(s,l,c),D=u(b);let w=a.get(D);w?F.push(()=>w.p(b,t)):(w=d(D,b),w.c()),B.set(D,E[c]=w),D in o&&R.set(D,Math.abs(c-o[D]))}const N=new Set,q=new Set;function L(b){z(b,1),b.m(n,_),a.set(b.key,b),_=b.first,f--}for(;m&&f;){const b=E[f-1],D=e[m-1],w=b.key,x=D.key;b===D?(_=b.first,m--,f--):B.has(x)?!a.has(w)||N.has(w)?L(b):q.has(x)?m--:R.get(w)>R.get(x)?(q.add(w),L(b)):(N.add(x),m--):(i(D,a),m--)}for(;m--;){const b=e[m];B.has(b.key)||i(b,a)}for(;f;)L(E[f-1]);return W(F),E}function il(e,t,u){const r=e.$$.props[t];r!==void 0&&(e.$$.bound[r]=u,u(e.$$.ctx[r]))}function Fe(e){e&&e.c()}function Ee(e,t,u,r){const{fragment:s,after_update:l}=e.$$;s&&s.m(t,u),r||Te(()=>{const a=e.$$.on_mount.map(hu).filter(mu);e.$$.on_destroy?e.$$.on_destroy.push(...a):W(a),e.$$.on_mount=[]}),l.forEach(Te)}function de(e,t){const u=e.$$;u.fragment!==null&&(ll(u.after_update),W(u.on_destroy),u.fragment&&u.fragment.d(t),u.on_destroy=u.fragment=null,u.ctx=[])}function ol(e,t){e.$$.dirty[0]===-1&&(X.push(e),tl(),e.$$.dirty.fill(0)),e.$$.dirty[t/31|0]|=1<<t%31}function he(e,t,u,r,s,l,a,n=[-1]){const i=se;re(e);const d=e.$$={fragment:null,ctx:[],props:l,update:P,not_equal:s,bound:Ne(),on_mount:[],on_destroy:[],on_disconnect:[],before_update:[],after_update:[],context:new Map(t.context||(i?i.$$.context:[])),callbacks:Ne(),dirty:n,skip_bound:!1,root:t.target||i.$$.root};a&&a(d.root);let _=!1;if(d.ctx=u?u(e,t.props||{},(h,m,...f)=>{const c=f.length?f[0]:m;return d.ctx&&s(d.ctx[h],d.ctx[h]=c)&&(!d.skip_bound&&d.bound[h]&&d.bound[h](c),_&&ol(e,h)),m}):[],d.update(),_=!0,W(d.before_update),d.fragment=r?r(d.ctx):!1,t.target){if(t.hydrate){const h=Xs(t.target);d.fragment&&d.fragment.l(h),h.forEach(v)}else d.fragment&&d.fragment.c();t.intro&&z(e.$$.fragment),Ee(e,t.target,t.anchor,t.customElement),gu()}re(i)}var me=class{$destroy(){de(this,1),this.$destroy=P}$on(e,t){if(!mu(t))return P;const u=this.$$.callbacks[e]||(this.$$.callbacks[e]=[]);return u.push(t),()=>{const r=u.indexOf(t);r!==-1&&u.splice(r,1)}}$set(e){this.$$set&&!Zs(e)&&(this.$$.skip_bound=!0,this.$$set(e),this.$$.skip_bound=!1)}};function O(e){const t=typeof e=="string"?e.charCodeAt(0):e;return t>=97&&t<=122||t>=65&&t<=90}function Q(e){const t=typeof e=="string"?e.charCodeAt(0):e;return t>=48&&t<=57}function V(e){return O(e)||Q(e)}var _l=["art-lojban","cel-gaulish","no-bok","no-nyn","zh-guoyu","zh-hakka","zh-min","zh-min-nan","zh-xiang"],je={"en-gb-oed":"en-GB-oxendict","i-ami":"ami","i-bnn":"bnn","i-default":null,"i-enochian":null,"i-hak":"hak","i-klingon":"tlh","i-lux":"lb","i-mingo":null,"i-navajo":"nv","i-pwn":"pwn","i-tao":"tao","i-tay":"tay","i-tsu":"tsu","sgn-be-fr":"sfb","sgn-be-nl":"vgt","sgn-ch-de":"sgg","art-lojban":"jbo","cel-gaulish":null,"no-bok":"nb","no-nyn":"nn","zh-guoyu":"cmn","zh-hakka":"hak","zh-min":null,"zh-min-nan":"nan","zh-xiang":"hsn"},cl={}.hasOwnProperty;function Ru(e,t={}){const u=Oe(),r=String(e),s=r.toLowerCase();let l=0;if(e==null)throw new Error("Expected string, got `"+e+"`");if(cl.call(je,s)){const n=je[s];return(t.normalize===void 0||t.normalize===null||t.normalize)&&typeof n=="string"?Ru(n):(u[_l.includes(s)?"regular":"irregular"]=r,u)}for(;O(s.charCodeAt(l))&&l<9;)l++;if(l>1&&l<9){if(u.language=r.slice(0,l),l<4){let n=0;for(;s.charCodeAt(l)===45&&O(s.charCodeAt(l+1))&&O(s.charCodeAt(l+2))&&O(s.charCodeAt(l+3))&&!O(s.charCodeAt(l+4));){if(n>2)return a(l,3,"Too many extended language subtags, expected at most 3 subtags");u.extendedLanguageSubtags.push(r.slice(l+1,l+4)),l+=4,n++}}for(s.charCodeAt(l)===45&&O(s.charCodeAt(l+1))&&O(s.charCodeAt(l+2))&&O(s.charCodeAt(l+3))&&O(s.charCodeAt(l+4))&&!O(s.charCodeAt(l+5))&&(u.script=r.slice(l+1,l+5),l+=5),s.charCodeAt(l)===45&&(O(s.charCodeAt(l+1))&&O(s.charCodeAt(l+2))&&!O(s.charCodeAt(l+3))?(u.region=r.slice(l+1,l+3),l+=3):Q(s.charCodeAt(l+1))&&Q(s.charCodeAt(l+2))&&Q(s.charCodeAt(l+3))&&!Q(s.charCodeAt(l+4))&&(u.region=r.slice(l+1,l+4),l+=4));s.charCodeAt(l)===45;){const n=l+1;let i=n;for(;V(s.charCodeAt(i));){if(i-n>7)return a(i,1,"Too long variant, expected at most 8 characters");i++}if(i-n>4||i-n>3&&Q(s.charCodeAt(n)))u.variants.push(r.slice(n,i)),l=i;else break}for(;s.charCodeAt(l)===45&&!(s.charCodeAt(l+1)===120||!V(s.charCodeAt(l+1))||s.charCodeAt(l+2)!==45||!V(s.charCodeAt(l+3)));){let n=l+2,i=0;for(;s.charCodeAt(n)===45&&V(s.charCodeAt(n+1))&&V(s.charCodeAt(n+2));){const d=n+1;for(n=d+2,i++;V(s.charCodeAt(n));){if(n-d>7)return a(n,2,"Too long extension, expected at most 8 characters");n++}}if(!i)return a(n,4,"Empty extension, extensions must have at least 2 characters of content");u.extensions.push({singleton:r.charAt(l+1),extensions:r.slice(l+3,n).split("-")}),l=n}}else l=0;if(l===0&&s.charCodeAt(l)===120||s.charCodeAt(l)===45&&s.charCodeAt(l+1)===120){l=l?l+2:1;let n=l;for(;s.charCodeAt(n)===45&&V(s.charCodeAt(n+1));){const i=l+1;for(n=i;V(s.charCodeAt(n));){if(n-i>7)return a(n,5,"Too long private-use area, expected at most 8 characters");n++}u.privateuse.push(r.slice(l+1,n)),l=n}}if(l!==r.length)return a(l,6,"Found superfluous content after tag");return u;function a(n,i,d){return t.warning&&t.warning(d,i,n),t.forgiving?u:Oe()}}function Oe(){return{language:null,extendedLanguageSubtags:[],script:null,region:null,variants:[],extensions:[],privateuse:[],irregular:null,regular:null}}function Ue(e,t,u){const r=e.slice();return r[8]=t[u][0],r[9]=t[u][1],r}function fl(e){let t,u,r,s,l,a=e[0]&&Ie();return{c(){a&&a.c(),t=M(),u=p("div"),r=p("p"),r.textContent=`${e[3](30)}`,s=M(),l=p("p"),l.textContent=`${e[3](40)}`,g(r,"class","pagefind-ui__result-title pagefind-ui__loading svelte-j9e30"),g(l,"class","pagefind-ui__result-excerpt pagefind-ui__loading svelte-j9e30"),g(u,"class","pagefind-ui__result-inner svelte-j9e30")},m(n,i){a&&a.m(n,i),T(n,t,i),T(n,u,i),A(u,r),A(u,s),A(u,l)},p(n,i){n[0]?a||(a=Ie(),a.c(),a.m(t.parentNode,t)):a&&(a.d(1),a=null)},d(n){a&&a.d(n),n&&v(t),n&&v(u)}}}function El(e){let t,u,r,s,l=e[1].meta?.title+"",a,n,i,d,_=e[1].excerpt+"",h,m=e[0]&&Pe(e),f=e[2].length&&xe(e);return{c(){m&&m.c(),t=M(),u=p("div"),r=p("p"),s=p("a"),a=S(l),i=M(),d=p("p"),h=M(),f&&f.c(),g(s,"class","pagefind-ui__result-link svelte-j9e30"),g(s,"href",n=e[1].meta?.url||e[1].url),g(r,"class","pagefind-ui__result-title svelte-j9e30"),g(d,"class","pagefind-ui__result-excerpt svelte-j9e30"),g(u,"class","pagefind-ui__result-inner svelte-j9e30")},m(c,o){m&&m.m(c,o),T(c,t,o),T(c,u,o),A(u,r),A(r,s),A(s,a),A(u,i),A(u,d),d.innerHTML=_,A(u,h),f&&f.m(u,null)},p(c,o){c[0]?m?m.p(c,o):(m=Pe(c),m.c(),m.m(t.parentNode,t)):m&&(m.d(1),m=null),o&2&&l!==(l=c[1].meta?.title+"")&&j(a,l),o&2&&n!==(n=c[1].meta?.url||c[1].url)&&g(s,"href",n),o&2&&_!==(_=c[1].excerpt+"")&&(d.innerHTML=_),c[2].length?f?f.p(c,o):(f=xe(c),f.c(),f.m(u,null)):f&&(f.d(1),f=null)},d(c){m&&m.d(c),c&&v(t),c&&v(u),f&&f.d()}}}function Ie(e){let t;return{c(){t=p("div"),g(t,"class","pagefind-ui__result-thumb pagefind-ui__loading svelte-j9e30")},m(u,r){T(u,t,r)},d(u){u&&v(t)}}}function Pe(e){let t,u=e[1].meta.image&&Le(e);return{c(){t=p("div"),u&&u.c(),g(t,"class","pagefind-ui__result-thumb svelte-j9e30")},m(r,s){T(r,t,s),u&&u.m(t,null)},p(r,s){r[1].meta.image?u?u.p(r,s):(u=Le(r),u.c(),u.m(t,null)):u&&(u.d(1),u=null)},d(r){r&&v(t),u&&u.d()}}}function Le(e){let t,u,r;return{c(){t=p("img"),g(t,"class","pagefind-ui__result-image svelte-j9e30"),ce(t.src,u=e[1].meta?.image)||g(t,"src",u),g(t,"alt",r=e[1].meta?.image_alt||e[1].meta?.title)},m(s,l){T(s,t,l)},p(s,l){l&2&&!ce(t.src,u=s[1].meta?.image)&&g(t,"src",u),l&2&&r!==(r=s[1].meta?.image_alt||s[1].meta?.title)&&g(t,"alt",r)},d(s){s&&v(t)}}}function xe(e){let t,u=e[2],r=[];for(let s=0;s<u.length;s+=1)r[s]=qe(Ue(e,u,s));return{c(){t=p("ul");for(let s=0;s<r.length;s+=1)r[s].c();g(t,"class","pagefind-ui__result-tags svelte-j9e30")},m(s,l){T(s,t,l);for(let a=0;a<r.length;a+=1)r[a]&&r[a].m(t,null)},p(s,l){if(l&4){u=s[2];let a;for(a=0;a<u.length;a+=1){const n=Ue(s,u,a);r[a]?r[a].p(n,l):(r[a]=qe(n),r[a].c(),r[a].m(t,null))}for(;a<r.length;a+=1)r[a].d(1);r.length=u.length}},d(s){s&&v(t),ie(r,s)}}}function qe(e){let t,u=e[8].replace(/^(\w)/,Ve)+"",r,s,l=e[9]+"",a,n;return{c(){t=p("li"),r=S(u),s=S(": "),a=S(l),n=M(),g(t,"class","pagefind-ui__result-tag svelte-j9e30")},m(i,d){T(i,t,d),A(t,r),A(t,s),A(t,a),A(t,n)},p(i,d){d&4&&u!==(u=i[8].replace(/^(\w)/,Ve)+"")&&j(r,u),d&4&&l!==(l=i[9]+"")&&j(a,l)},d(i){i&&v(t)}}}function dl(e){let t;function u(l,a){return l[1]?El:fl}let r=u(e),s=r(e);return{c(){t=p("li"),s.c(),g(t,"class","pagefind-ui__result svelte-j9e30")},m(l,a){T(l,t,a),s.m(t,null)},p(l,[a]){r===(r=u(l))&&s?s.p(l,a):(s.d(1),s=r(l),s&&(s.c(),s.m(t,null)))},i:P,o:P,d(l){l&&v(t),s.d()}}}var Ve=e=>e.toLocaleUpperCase();function hl(e,t,u){let{show_images:r=!0}=t,{process_result:s=null}=t,{result:l={data:async()=>{}}}=t;const a=["title","image","image_alt","url"];let n,i=[];const d=async h=>{u(1,n=await h.data()),u(1,n=s?.(n)??n),u(2,i=Object.entries(n.meta).filter(([m])=>!a.includes(m)))},_=(h=30)=>". ".repeat(Math.floor(10+Math.random()*h));return e.$$set=h=>{"show_images"in h&&u(0,r=h.show_images),"process_result"in h&&u(4,s=h.process_result),"result"in h&&u(5,l=h.result)},e.$$.update=()=>{e.$$.dirty&32&&d(l)},[r,n,i,_,s,l]}var ml=class extends me{constructor(e){super(),he(this,e,hl,dl,fe,{show_images:0,process_result:4,result:5})}},Cl=ml;function Ke(e,t,u){const r=e.slice();return r[11]=t[u][0],r[12]=t[u][1],r}function Ge(e,t,u){const r=e.slice();return r[15]=t[u],r}function gl(e){let t,u,r,s,l,a=e[0]&&Je();return{c(){a&&a.c(),t=M(),u=p("div"),r=p("p"),r.textContent=`${e[5](30)}`,s=M(),l=p("p"),l.textContent=`${e[5](40)}`,g(r,"class","pagefind-ui__result-title pagefind-ui__loading svelte-4xnkmf"),g(l,"class","pagefind-ui__result-excerpt pagefind-ui__loading svelte-4xnkmf"),g(u,"class","pagefind-ui__result-inner svelte-4xnkmf")},m(n,i){a&&a.m(n,i),T(n,t,i),T(n,u,i),A(u,r),A(u,s),A(u,l)},p(n,i){n[0]?a||(a=Je(),a.c(),a.m(t.parentNode,t)):a&&(a.d(1),a=null)},d(n){a&&a.d(n),n&&v(t),n&&v(u)}}}function Rl(e){let t,u,r,s,l=e[1].meta?.title+"",a,n,i,d,_,h=e[0]&&We(e),m=e[4]&&Ye(e),f=e[3],c=[];for(let E=0;E<f.length;E+=1)c[E]=Xe(Ge(e,f,E));let o=e[2].length&&Qe(e);return{c(){h&&h.c(),t=M(),u=p("div"),r=p("p"),s=p("a"),a=S(l),i=M(),m&&m.c(),d=M();for(let E=0;E<c.length;E+=1)c[E].c();_=M(),o&&o.c(),g(s,"class","pagefind-ui__result-link svelte-4xnkmf"),g(s,"href",n=e[1].meta?.url||e[1].url),g(r,"class","pagefind-ui__result-title svelte-4xnkmf"),g(u,"class","pagefind-ui__result-inner svelte-4xnkmf")},m(E,B){h&&h.m(E,B),T(E,t,B),T(E,u,B),A(u,r),A(r,s),A(s,a),A(u,i),m&&m.m(u,null),A(u,d);for(let R=0;R<c.length;R+=1)c[R]&&c[R].m(u,null);A(u,_),o&&o.m(u,null)},p(E,B){if(E[0]?h?h.p(E,B):(h=We(E),h.c(),h.m(t.parentNode,t)):h&&(h.d(1),h=null),B&2&&l!==(l=E[1].meta?.title+"")&&j(a,l),B&2&&n!==(n=E[1].meta?.url||E[1].url)&&g(s,"href",n),E[4]?m?m.p(E,B):(m=Ye(E),m.c(),m.m(u,d)):m&&(m.d(1),m=null),B&8){f=E[3];let R;for(R=0;R<f.length;R+=1){const F=Ge(E,f,R);c[R]?c[R].p(F,B):(c[R]=Xe(F),c[R].c(),c[R].m(u,_))}for(;R<c.length;R+=1)c[R].d(1);c.length=f.length}E[2].length?o?o.p(E,B):(o=Qe(E),o.c(),o.m(u,null)):o&&(o.d(1),o=null)},d(E){h&&h.d(E),E&&v(t),E&&v(u),m&&m.d(),ie(c,E),o&&o.d()}}}function Je(e){let t;return{c(){t=p("div"),g(t,"class","pagefind-ui__result-thumb pagefind-ui__loading svelte-4xnkmf")},m(u,r){T(u,t,r)},d(u){u&&v(t)}}}function We(e){let t,u=e[1].meta.image&&Ze(e);return{c(){t=p("div"),u&&u.c(),g(t,"class","pagefind-ui__result-thumb svelte-4xnkmf")},m(r,s){T(r,t,s),u&&u.m(t,null)},p(r,s){r[1].meta.image?u?u.p(r,s):(u=Ze(r),u.c(),u.m(t,null)):u&&(u.d(1),u=null)},d(r){r&&v(t),u&&u.d()}}}function Ze(e){let t,u,r;return{c(){t=p("img"),g(t,"class","pagefind-ui__result-image svelte-4xnkmf"),ce(t.src,u=e[1].meta?.image)||g(t,"src",u),g(t,"alt",r=e[1].meta?.image_alt||e[1].meta?.title)},m(s,l){T(s,t,l)},p(s,l){l&2&&!ce(t.src,u=s[1].meta?.image)&&g(t,"src",u),l&2&&r!==(r=s[1].meta?.image_alt||s[1].meta?.title)&&g(t,"alt",r)},d(s){s&&v(t)}}}function Ye(e){let t,u=e[1].excerpt+"";return{c(){t=p("p"),g(t,"class","pagefind-ui__result-excerpt svelte-4xnkmf")},m(r,s){T(r,t,s),t.innerHTML=u},p(r,s){s&2&&u!==(u=r[1].excerpt+"")&&(t.innerHTML=u)},d(r){r&&v(t)}}}function Xe(e){let t,u,r,s=e[15].title+"",l,a,n,i,d=e[15].excerpt+"";return{c(){t=p("div"),u=p("p"),r=p("a"),l=S(s),n=M(),i=p("p"),g(r,"class","pagefind-ui__result-link svelte-4xnkmf"),g(r,"href",a=e[15].url),g(u,"class","pagefind-ui__result-title svelte-4xnkmf"),g(i,"class","pagefind-ui__result-excerpt svelte-4xnkmf"),g(t,"class","pagefind-ui__result-nested svelte-4xnkmf")},m(_,h){T(_,t,h),A(t,u),A(u,r),A(r,l),A(t,n),A(t,i),i.innerHTML=d},p(_,h){h&8&&s!==(s=_[15].title+"")&&j(l,s),h&8&&a!==(a=_[15].url)&&g(r,"href",a),h&8&&d!==(d=_[15].excerpt+"")&&(i.innerHTML=d)},d(_){_&&v(t)}}}function Qe(e){let t,u=e[2],r=[];for(let s=0;s<u.length;s+=1)r[s]=$e(Ke(e,u,s));return{c(){t=p("ul");for(let s=0;s<r.length;s+=1)r[s].c();g(t,"class","pagefind-ui__result-tags svelte-4xnkmf")},m(s,l){T(s,t,l);for(let a=0;a<r.length;a+=1)r[a]&&r[a].m(t,null)},p(s,l){if(l&4){u=s[2];let a;for(a=0;a<u.length;a+=1){const n=Ke(s,u,a);r[a]?r[a].p(n,l):(r[a]=$e(n),r[a].c(),r[a].m(t,null))}for(;a<r.length;a+=1)r[a].d(1);r.length=u.length}},d(s){s&&v(t),ie(r,s)}}}function $e(e){let t,u=e[11].replace(/^(\w)/,eu)+"",r,s,l=e[12]+"",a,n;return{c(){t=p("li"),r=S(u),s=S(": "),a=S(l),n=M(),g(t,"class","pagefind-ui__result-tag svelte-4xnkmf")},m(i,d){T(i,t,d),A(t,r),A(t,s),A(t,a),A(t,n)},p(i,d){d&4&&u!==(u=i[11].replace(/^(\w)/,eu)+"")&&j(r,u),d&4&&l!==(l=i[12]+"")&&j(a,l)},d(i){i&&v(t)}}}function Bl(e){let t;function u(l,a){return l[1]?Rl:gl}let r=u(e),s=r(e);return{c(){t=p("li"),s.c(),g(t,"class","pagefind-ui__result svelte-4xnkmf")},m(l,a){T(l,t,a),s.m(t,null)},p(l,[a]){r===(r=u(l))&&s?s.p(l,a):(s.d(1),s=r(l),s&&(s.c(),s.m(t,null)))},i:P,o:P,d(l){l&&v(t),s.d()}}}var eu=e=>e.toLocaleUpperCase();function Al(e,t,u){let{show_images:r=!0}=t,{process_result:s=null}=t,{result:l={data:async()=>{}}}=t;const a=["title","image","image_alt","url"];let n,i=[],d=[],_=!1;const h=(c,o)=>{if(c.length<=o)return c;const E=[...c].sort((B,R)=>R.locations.length-B.locations.length).slice(0,3).map(B=>B.url);return c.filter(B=>E.includes(B.url))},m=async c=>{u(1,n=await c.data()),u(1,n=s?.(n)??n),u(2,i=Object.entries(n.meta).filter(([o])=>!a.includes(o))),Array.isArray(n.sub_results)&&(u(4,_=n.sub_results?.[0]?.url===(n.meta?.url||n.url)),_?u(3,d=h(n.sub_results.slice(1),3)):u(3,d=h([...n.sub_results],3)))},f=(c=30)=>". ".repeat(Math.floor(10+Math.random()*c));return e.$$set=c=>{"show_images"in c&&u(0,r=c.show_images),"process_result"in c&&u(6,s=c.process_result),"result"in c&&u(7,l=c.result)},e.$$.update=()=>{e.$$.dirty&128&&m(l)},[r,n,i,d,_,f,s,l]}var pl=class extends me{constructor(e){super(),he(this,e,Al,Bl,fe,{show_images:0,process_result:6,result:7})}},vl=pl;function uu(e,t,u){const r=e.slice();return r[10]=t[u][0],r[11]=t[u][1],r[12]=t,r[13]=u,r}function tu(e,t,u){const r=e.slice();return r[14]=t[u][0],r[15]=t[u][1],r[16]=t,r[17]=u,r}function ru(e){let t,u,r=e[4]("filters_label",e[5],e[6])+"",s,l,a=Object.entries(e[1]),n=[];for(let i=0;i<a.length;i+=1)n[i]=au(uu(e,a,i));return{c(){t=p("fieldset"),u=p("legend"),s=S(r),l=M();for(let i=0;i<n.length;i+=1)n[i].c();g(u,"class","pagefind-ui__filter-panel-label svelte-1v2r7ls"),g(t,"class","pagefind-ui__filter-panel svelte-1v2r7ls")},m(i,d){T(i,t,d),A(t,u),A(u,s),A(t,l);for(let _=0;_<n.length;_+=1)n[_]&&n[_].m(t,null)},p(i,d){if(d&112&&r!==(r=i[4]("filters_label",i[5],i[6])+"")&&j(s,r),d&143){a=Object.entries(i[1]);let _;for(_=0;_<a.length;_+=1){const h=uu(i,a,_);n[_]?n[_].p(h,d):(n[_]=au(h),n[_].c(),n[_].m(t,null))}for(;_<n.length;_+=1)n[_].d(1);n.length=a.length}},d(i){i&&v(t),ie(n,i)}}}function su(e){let t,u,r,s,l,a,n,i,d=e[14]+"",_,h=e[15]+"",m,f,c,o,E,B;function R(){e[9].call(u,e[10],e[14])}return{c(){t=p("div"),u=p("input"),a=M(),n=p("label"),i=new Qs(!1),_=S(" ("),m=S(h),f=S(")"),o=M(),g(u,"class","pagefind-ui__filter-checkbox svelte-1v2r7ls"),g(u,"type","checkbox"),g(u,"id",r=e[10]+"-"+e[14]),g(u,"name",s=e[10]),u.__value=l=e[14],u.value=u.__value,i.a=_,g(n,"class","pagefind-ui__filter-label svelte-1v2r7ls"),g(n,"for",c=e[10]+"-"+e[14]),g(t,"class","pagefind-ui__filter-value svelte-1v2r7ls"),K(t,"pagefind-ui__filter-value--checked",e[0][`${e[10]}:${e[14]}`])},m(F,N){T(F,t,N),A(t,u),u.checked=e[0][`${e[10]}:${e[14]}`],A(t,a),A(t,n),i.m(d,n),A(n,_),A(n,m),A(n,f),A(t,o),E||(B=G(u,"change",R),E=!0)},p(F,N){e=F,N&2&&r!==(r=e[10]+"-"+e[14])&&g(u,"id",r),N&2&&s!==(s=e[10])&&g(u,"name",s),N&2&&l!==(l=e[14])&&(u.__value=l,u.value=u.__value),N&3&&(u.checked=e[0][`${e[10]}:${e[14]}`]),N&2&&d!==(d=e[14]+"")&&i.p(d),N&2&&h!==(h=e[15]+"")&&j(m,h),N&2&&c!==(c=e[10]+"-"+e[14])&&g(n,"for",c),N&3&&K(t,"pagefind-ui__filter-value--checked",e[0][`${e[10]}:${e[14]}`])},d(F){F&&v(t),E=!1,B()}}}function lu(e){let t,u=(e[2]||e[15]||e[0][`${e[10]}:${e[14]}`])&&su(e);return{c(){u&&u.c(),t=ee()},m(r,s){u&&u.m(r,s),T(r,t,s)},p(r,s){r[2]||r[15]||r[0][`${r[10]}:${r[14]}`]?u?u.p(r,s):(u=su(r),u.c(),u.m(t.parentNode,t)):u&&(u.d(1),u=null)},d(r){u&&u.d(r),r&&v(t)}}}function au(e){let t,u,r=e[10].replace(/^(\w)/,nu)+"",s,l,a,n=e[10]+"",i,d,_,h=Object.entries(e[11]||{}),m=[];for(let f=0;f<h.length;f+=1)m[f]=lu(tu(e,h,f));return{c(){t=p("details"),u=p("summary"),s=M(),l=p("fieldset"),a=p("legend"),i=M();for(let f=0;f<m.length;f+=1)m[f].c();d=M(),g(u,"class","pagefind-ui__filter-name svelte-1v2r7ls"),g(a,"class","pagefind-ui__filter-group-label svelte-1v2r7ls"),g(l,"class","pagefind-ui__filter-group svelte-1v2r7ls"),g(t,"class","pagefind-ui__filter-block svelte-1v2r7ls"),t.open=_=e[7]||e[3].map(iu).includes(e[10].toLowerCase())},m(f,c){T(f,t,c),A(t,u),u.innerHTML=r,A(t,s),A(t,l),A(l,a),a.innerHTML=n,A(l,i);for(let o=0;o<m.length;o+=1)m[o]&&m[o].m(l,null);A(t,d)},p(f,c){if(c&2&&r!==(r=f[10].replace(/^(\w)/,nu)+"")&&(u.innerHTML=r),c&2&&n!==(n=f[10]+"")&&(a.innerHTML=n),c&7){h=Object.entries(f[11]||{});let o;for(o=0;o<h.length;o+=1){const E=tu(f,h,o);m[o]?m[o].p(E,c):(m[o]=lu(E),m[o].c(),m[o].m(l,null))}for(;o<m.length;o+=1)m[o].d(1);m.length=h.length}c&138&&_!==(_=f[7]||f[3].map(iu).includes(f[10].toLowerCase()))&&(t.open=_)},d(f){f&&v(t),ie(m,f)}}}function Tl(e){let t=e[1]&&Object.entries(e[1]).length,u,r=t&&ru(e);return{c(){r&&r.c(),u=ee()},m(s,l){r&&r.m(s,l),T(s,u,l)},p(s,[l]){l&2&&(t=s[1]&&Object.entries(s[1]).length),t?r?r.p(s,l):(r=ru(s),r.c(),r.m(u.parentNode,u)):r&&(r.d(1),r=null)},i:P,o:P,d(s){r&&r.d(s),s&&v(u)}}}var nu=e=>e.toLocaleUpperCase(),iu=e=>e.toLowerCase();function kl(e,t,u){let{available_filters:r=null}=t,{show_empty_filters:s=!0}=t,{open_filters:l=[]}=t,{translate:a=()=>""}=t,{automatic_translations:n={}}=t,{translations:i={}}=t,{selected_filters:d={}}=t,_=!1,h=!1;function m(f,c){d[`${f}:${c}`]=this.checked,u(0,d)}return e.$$set=f=>{"available_filters"in f&&u(1,r=f.available_filters),"show_empty_filters"in f&&u(2,s=f.show_empty_filters),"open_filters"in f&&u(3,l=f.open_filters),"translate"in f&&u(4,a=f.translate),"automatic_translations"in f&&u(5,n=f.automatic_translations),"translations"in f&&u(6,i=f.translations),"selected_filters"in f&&u(0,d=f.selected_filters)},e.$$.update=()=>{if(e.$$.dirty&258&&r&&!_){u(8,_=!0);let f=Object.entries(r||{});f.length===1&&Object.entries(f[0][1])?.length<=6&&u(7,h=!0)}},[d,r,s,l,a,n,i,h,_,m]}var Fl=class extends me{constructor(e){super(),he(this,e,kl,Tl,fe,{available_filters:1,show_empty_filters:2,open_filters:3,translate:4,automatic_translations:5,translations:6,selected_filters:0})}},bl=Fl,Bu={};k(Bu,{comments:()=>pu,default:()=>Ml,direction:()=>vu,strings:()=>Tu,thanks_to:()=>Au});var Au="Jan Claasen <jan@cloudcannon.com>",pu="",vu="ltr",Tu={placeholder:"Soek",clear_search:"Opruim",load_more:"Laai nog resultate",search_label:"Soek hierdie webwerf",filters_label:"Filters",zero_results:"Geen resultate vir [SEARCH_TERM]",many_results:"[COUNT] resultate vir [SEARCH_TERM]",one_result:"[COUNT] resultate vir [SEARCH_TERM]",alt_search:"Geen resultate vir [SEARCH_TERM]. Toon resultate vir [DIFFERENT_TERM] in plaas daarvan",search_suggestion:"Geen resultate vir [SEARCH_TERM]. Probeer eerder een van die volgende terme:",searching:"Soek vir [SEARCH_TERM]"},Ml={thanks_to:Au,comments:pu,direction:vu,strings:Tu},ku={};k(ku,{comments:()=>bu,default:()=>Sl,direction:()=>Mu,strings:()=>Su,thanks_to:()=>Fu});var Fu="Maruf Alom <mail@marufalom.com>",bu="",Mu="ltr",Su={placeholder:"অনুসন্ধান করুন",clear_search:"মুছে ফেলুন",load_more:"আরো ফলাফল দেখুন",search_label:"এই ওয়েবসাইটে অনুসন্ধান করুন",filters_label:"ফিল্টার",zero_results:"[SEARCH_TERM] এর জন্য কিছু খুঁজে পাওয়া যায়নি",many_results:"[COUNT]-টি ফলাফল পাওয়া গিয়েছে [SEARCH_TERM] এর জন্য",one_result:"[COUNT]-টি ফলাফল পাওয়া গিয়েছে [SEARCH_TERM] এর জন্য",alt_search:"কোন কিছু খুঁজে পাওয়া যায়নি [SEARCH_TERM] এর জন্য. পরিবর্তে [DIFFERENT_TERM] এর জন্য দেখানো হচ্ছে",search_suggestion:"কোন কিছু খুঁজে পাওয়া যায়নি [SEARCH_TERM] এর বিষয়ে. নিন্মের বিষয়বস্তু খুঁজে দেখুন:",searching:"অনুসন্ধান চলছে [SEARCH_TERM]..."},Sl={thanks_to:Fu,comments:bu,direction:Mu,strings:Su},Du={};k(Du,{comments:()=>wu,default:()=>Dl,direction:()=>yu,strings:()=>Nu,thanks_to:()=>Hu});var Hu="Pablo Villaverde <https://github.com/pvillaverde>",wu="",yu="ltr",Nu={placeholder:"Cerca",clear_search:"Netejar",load_more:"Veure mées resultats",search_label:"Cerca en aquest lloc",filters_label:"Filtres",zero_results:"No es van trobar resultats per [SEARCH_TERM]",many_results:"[COUNT] resultats trobats per [SEARCH_TERM]",one_result:"[COUNT] resultat trobat per [SEARCH_TERM]",alt_search:"No es van trobar resultats per [SEARCH_TERM]. Mostrant al seu lloc resultats per [DIFFERENT_TERM]",search_suggestion:"No es van trobar resultats per [SEARCH_TERM]. Proveu una de les cerques següents:",searching:"Cercant [SEARCH_TERM]..."},Dl={thanks_to:Hu,comments:wu,direction:yu,strings:Nu},zu={};k(zu,{comments:()=>Ou,default:()=>Hl,direction:()=>Uu,strings:()=>Iu,thanks_to:()=>ju});var ju="Dalibor Hon <https://github.com/dallyh>",Ou="",Uu="ltr",Iu={placeholder:"Hledat",clear_search:"Smazat",load_more:"Načíst další výsledky",search_label:"Prohledat tuto stránku",filters_label:"Filtry",zero_results:"Žádné výsledky pro [SEARCH_TERM]",many_results:"[COUNT] výsledků pro [SEARCH_TERM]",one_result:"[COUNT] výsledek pro [SEARCH_TERM]",alt_search:"Žádné výsledky pro [SEARCH_TERM]. Zobrazují se výsledky pro [DIFFERENT_TERM]",search_suggestion:"Žádné výsledky pro [SEARCH_TERM]. Související výsledky hledání:",searching:"Hledám [SEARCH_TERM]..."},Hl={thanks_to:ju,comments:Ou,direction:Uu,strings:Iu},Pu={};k(Pu,{comments:()=>xu,default:()=>wl,direction:()=>qu,strings:()=>Vu,thanks_to:()=>Lu});var Lu="Jonas Smedegaard <dr@jones.dk>",xu="",qu="ltr",Vu={placeholder:"Søg",clear_search:"Nulstil",load_more:"Indlæs flere resultater",search_label:"Søg på dette website",filters_label:"Filtre",zero_results:"Ingen resultater for [SEARCH_TERM]",many_results:"[COUNT] resultater for [SEARCH_TERM]",one_result:"[COUNT] resultat for [SEARCH_TERM]",alt_search:"Ingen resultater for [SEARCH_TERM]. Viser resultater for [DIFFERENT_TERM] i stedet",search_suggestion:"Ingen resultater for [SEARCH_TERM]. Prøv et af disse søgeord i stedet:",searching:"Søger efter [SEARCH_TERM]..."},wl={thanks_to:Lu,comments:xu,direction:qu,strings:Vu},Ku={};k(Ku,{comments:()=>Ju,default:()=>yl,direction:()=>Wu,strings:()=>Zu,thanks_to:()=>Gu});var Gu="Jan Claasen <jan@cloudcannon.com>",Ju="",Wu="ltr",Zu={placeholder:"Suche",clear_search:"Löschen",load_more:"Mehr Ergebnisse laden",search_label:"Suche diese Seite",filters_label:"Filter",zero_results:"Keine Ergebnisse für [SEARCH_TERM]",many_results:"[COUNT] Ergebnisse für [SEARCH_TERM]",one_result:"[COUNT] Ergebnis für [SEARCH_TERM]",alt_search:"Keine Ergebnisse für [SEARCH_TERM]. Stattdessen werden Ergebnisse für [DIFFERENT_TERM] angezeigt",search_suggestion:"Keine Ergebnisse für [SEARCH_TERM]. Versuchen Sie eine der folgenden Suchen:",searching:"Suche für [SEARCH_TERM]"},yl={thanks_to:Gu,comments:Ju,direction:Wu,strings:Zu},Yu={};k(Yu,{comments:()=>Qu,default:()=>Nl,direction:()=>$u,strings:()=>et,thanks_to:()=>Xu});var Xu="Liam Bigelow <liam@cloudcannon.com>",Qu="",$u="ltr",et={placeholder:"Search",clear_search:"Clear",load_more:"Load more results",search_label:"Search this site",filters_label:"Filters",zero_results:"No results for [SEARCH_TERM]",many_results:"[COUNT] results for [SEARCH_TERM]",one_result:"[COUNT] result for [SEARCH_TERM]",alt_search:"No results for [SEARCH_TERM]. Showing results for [DIFFERENT_TERM] instead",search_suggestion:"No results for [SEARCH_TERM]. Try one of the following searches:",searching:"Searching for [SEARCH_TERM]..."},Nl={thanks_to:Xu,comments:Qu,direction:$u,strings:et},ut={};k(ut,{comments:()=>rt,default:()=>zl,direction:()=>st,strings:()=>lt,thanks_to:()=>tt});var tt="Pablo Villaverde <https://github.com/pvillaverde>",rt="",st="ltr",lt={placeholder:"Buscar",clear_search:"Limpiar",load_more:"Ver más resultados",search_label:"Buscar en este sitio",filters_label:"Filtros",zero_results:"No se encontraron resultados para [SEARCH_TERM]",many_results:"[COUNT] resultados encontrados para [SEARCH_TERM]",one_result:"[COUNT] resultado encontrado para [SEARCH_TERM]",alt_search:"No se encontraron resultados para [SEARCH_TERM]. Mostrando en su lugar resultados para [DIFFERENT_TERM]",search_suggestion:"No se encontraron resultados para [SEARCH_TERM]. Prueba una de las siguientes búsquedas:",searching:"Buscando [SEARCH_TERM]..."},zl={thanks_to:tt,comments:rt,direction:st,strings:lt},at={};k(at,{comments:()=>it,default:()=>jl,direction:()=>ot,strings:()=>_t,thanks_to:()=>nt});var nt="Valtteri Laitinen <dev@valtlai.fi>",it="",ot="ltr",_t={placeholder:"Haku",clear_search:"Tyhjennä",load_more:"Lataa lisää tuloksia",search_label:"Hae tältä sivustolta",filters_label:"Suodattimet",zero_results:"Ei tuloksia haulle [SEARCH_TERM]",many_results:"[COUNT] tulosta haulle [SEARCH_TERM]",one_result:"[COUNT] tulos haulle [SEARCH_TERM]",alt_search:"Ei tuloksia haulle [SEARCH_TERM]. Näytetään tulokset sen sijaan haulle [DIFFERENT_TERM]",search_suggestion:"Ei tuloksia haulle [SEARCH_TERM]. Kokeile jotain seuraavista:",searching:"Haetaan [SEARCH_TERM]..."},jl={thanks_to:nt,comments:it,direction:ot,strings:_t},ct={};k(ct,{comments:()=>Et,default:()=>Ol,direction:()=>dt,strings:()=>ht,thanks_to:()=>ft});var ft="Nicolas Friedli <nicolas@theologique.ch>",Et="",dt="ltr",ht={placeholder:"Rechercher",clear_search:"Nettoyer",load_more:"Charger plus de résultats",search_label:"Recherche sur ce site",filters_label:"Filtres",zero_results:"Pas de résultat pour [SEARCH_TERM]",many_results:"[COUNT] résultats pour [SEARCH_TERM]",one_result:"[COUNT] résultat pour [SEARCH_TERM]",alt_search:"Pas de résultat pour [SEARCH_TERM]. Montre les résultats pour [DIFFERENT_TERM] à la place",search_suggestion:"Pas de résultat pour [SEARCH_TERM]. Essayer une des recherches suivantes:",searching:"Recherche [SEARCH_TERM]..."},Ol={thanks_to:ft,comments:Et,direction:dt,strings:ht},mt={};k(mt,{comments:()=>gt,default:()=>Ul,direction:()=>Rt,strings:()=>Bt,thanks_to:()=>Ct});var Ct="Pablo Villaverde <https://github.com/pvillaverde>",gt="",Rt="ltr",Bt={placeholder:"Buscar",clear_search:"Limpar",load_more:"Ver máis resultados",search_label:"Buscar neste sitio",filters_label:"Filtros",zero_results:"Non se atoparon resultados para [SEARCH_TERM]",many_results:"[COUNT] resultados atopados para [SEARCH_TERM]",one_result:"[COUNT] resultado atopado para [SEARCH_TERM]",alt_search:"Non se atoparon resultados para [SEARCH_TERM]. Amosando no seu lugar resultados para [DIFFERENT_TERM]",search_suggestion:"Non se atoparon resultados para [SEARCH_TERM]. Probe unha das seguintes pesquisas:",searching:"Buscando [SEARCH_TERM]..."},Ul={thanks_to:Ct,comments:gt,direction:Rt,strings:Bt},At={};k(At,{comments:()=>vt,default:()=>Il,direction:()=>Tt,strings:()=>kt,thanks_to:()=>pt});var pt="Amit Yadav <amit@thetechbasket.com>",vt="",Tt="ltr",kt={placeholder:"खोजें",clear_search:"साफ करें",load_more:"और अधिक परिणाम लोड करें",search_label:"इस साइट में खोजें",filters_label:"फ़िल्टर",zero_results:"कोई परिणाम [SEARCH_TERM] के लिए नहीं मिला",many_results:"[COUNT] परिणाम [SEARCH_TERM] के लिए मिले",one_result:"[COUNT] परिणाम [SEARCH_TERM] के लिए मिला",alt_search:"[SEARCH_TERM] के लिए कोई परिणाम नहीं मिला। इसके बजाय [DIFFERENT_TERM] के लिए परिणाम दिखा रहा है",search_suggestion:"[SEARCH_TERM] के लिए कोई परिणाम नहीं मिला। निम्नलिखित खोजों में से कोई एक आज़माएं:",searching:"[SEARCH_TERM] की खोज की जा रही है..."},Il={thanks_to:pt,comments:vt,direction:Tt,strings:kt},Ft={};k(Ft,{comments:()=>Mt,default:()=>Pl,direction:()=>St,strings:()=>Dt,thanks_to:()=>bt});var bt="Diomed <https://github.com/diomed>",Mt="",St="ltr",Dt={placeholder:"Traži",clear_search:"Očisti",load_more:"Učitaj više rezultata",search_label:"Pretraži ovu stranicu",filters_label:"Filteri",zero_results:"Nema rezultata za [SEARCH_TERM]",many_results:"[COUNT] rezultata za [SEARCH_TERM]",one_result:"[COUNT] rezultat za [SEARCH_TERM]",alt_search:"Nema rezultata za [SEARCH_TERM]. Prikazujem rezultate za [DIFFERENT_TERM]",search_suggestion:"Nema rezultata za [SEARCH_TERM]. Pokušaj s jednom od ovih pretraga:",searching:"Pretražujem [SEARCH_TERM]..."},Pl={thanks_to:bt,comments:Mt,direction:St,strings:Dt},Ht={};k(Ht,{comments:()=>yt,default:()=>Ll,direction:()=>Nt,strings:()=>zt,thanks_to:()=>wt});var wt="Adam Laki <info@adamlaki.com>",yt="",Nt="ltr",zt={placeholder:"Keresés",clear_search:"Törlés",load_more:"További találatok betöltése",search_label:"Keresés az oldalon",filters_label:"Szűrés",zero_results:"Nincs találat a(z) [SEARCH_TERM] kifejezésre",many_results:"[COUNT] db találat a(z) [SEARCH_TERM] kifejezésre",one_result:"[COUNT] db találat a(z) [SEARCH_TERM] kifejezésre",alt_search:"Nincs találat a(z) [SEARCH_TERM] kifejezésre. Találatok mutatása inkább a(z) [DIFFERENT_TERM] kifejezésre",search_suggestion:"Nincs találat a(z) [SEARCH_TERM] kifejezésre. Próbáld meg a következő keresések egyikét:",searching:"Keresés a(z) [SEARCH_TERM] kifejezésre..."},Ll={thanks_to:wt,comments:yt,direction:Nt,strings:zt},jt={};k(jt,{comments:()=>Ut,default:()=>xl,direction:()=>It,strings:()=>Pt,thanks_to:()=>Ot});var Ot="Nixentric",Ut="",It="ltr",Pt={placeholder:"Cari",clear_search:"Bersihkan",load_more:"Muat lebih banyak hasil",search_label:"Telusuri situs ini",filters_label:"Filter",zero_results:"[SEARCH_TERM] tidak ditemukan",many_results:"Ditemukan [COUNT] hasil untuk [SEARCH_TERM]",one_result:"Ditemukan [COUNT] hasil untuk [SEARCH_TERM]",alt_search:"[SEARCH_TERM] tidak ditemukan. Menampilkan hasil [DIFFERENT_TERM] sebagai gantinya",search_suggestion:"[SEARCH_TERM] tidak ditemukan. Coba salah satu pencarian berikut ini:",searching:"Mencari [SEARCH_TERM]..."},xl={thanks_to:Ot,comments:Ut,direction:It,strings:Pt},Lt={};k(Lt,{comments:()=>qt,default:()=>ql,direction:()=>Vt,strings:()=>Kt,thanks_to:()=>xt});var xt="Cosette Bruhns Alonso, Andrew Janco <apjanco@upenn.edu>",qt="",Vt="ltr",Kt={placeholder:"Cerca",clear_search:"Cancella la cronologia",load_more:"Mostra più risultati",search_label:"Cerca nel sito",filters_label:"Filtri di ricerca",zero_results:"Nessun risultato per [SEARCH_TERM]",many_results:"[COUNT] risultati per [SEARCH_TERM]",one_result:"[COUNT] risultato per [SEARCH_TERM]",alt_search:"Nessun risultato per [SEARCH_TERM]. Mostrando risultati per [DIFFERENT_TERM] come alternativa.",search_suggestion:"Nessun risultato per [SEARCH_TERM]. Prova una delle seguenti ricerche:",searching:"Cercando [SEARCH_TERM]..."},ql={thanks_to:xt,comments:qt,direction:Vt,strings:Kt},Gt={};k(Gt,{comments:()=>Wt,default:()=>Vl,direction:()=>Zt,strings:()=>Yt,thanks_to:()=>Jt});var Jt="Tate",Wt="",Zt="ltr",Yt={placeholder:"検索",clear_search:"クリア",load_more:"次を読み込む",search_label:"このサイトを検索",filters_label:"フィルタ",zero_results:"[SEARCH_TERM]の検索に一致する情報はありませんでした",many_results:"[SEARCH_TERM]の[COUNT]件の検索結果",one_result:"[SEARCH_TERM]の[COUNT]件の検索結果",alt_search:"[SEARCH_TERM]の検索に一致する情報はありませんでした。[DIFFERENT_TERM]の検索結果を表示しています",search_suggestion:"[SEARCH_TERM]の検索に一致する情報はありませんでした。次のいずれかの検索を試してください",searching:"[SEARCH_TERM]を検索しています"},Vl={thanks_to:Jt,comments:Wt,direction:Zt,strings:Yt},Xt={};k(Xt,{comments:()=>$t,default:()=>Kl,direction:()=>er,strings:()=>ur,thanks_to:()=>Qt});var Qt="Seokho Son <https://github.com/seokho-son>",$t="",er="ltr",ur={placeholder:"검색어",clear_search:"비우기",load_more:"검색 결과 더 보기",search_label:"사이트 검색",filters_label:"필터",zero_results:"[SEARCH_TERM]에 대한 결과 없음",many_results:"[SEARCH_TERM]에 대한 결과 [COUNT]건",one_result:"[SEARCH_TERM]에 대한 결과 [COUNT]건",alt_search:"[SEARCH_TERM]에 대한 결과 없음. [DIFFERENT_TERM]에 대한 결과",search_suggestion:"[SEARCH_TERM]에 대한 결과 없음. 추천 검색어: ",searching:"[SEARCH_TERM] 검색 중..."},Kl={thanks_to:Qt,comments:$t,direction:er,strings:ur},tr={};k(tr,{comments:()=>sr,default:()=>Gl,direction:()=>lr,strings:()=>ar,thanks_to:()=>rr});var rr="",sr="",lr="ltr",ar={placeholder:"Rapu",clear_search:"Whakakore",load_more:"Whakauta ētahi otinga kē",search_label:"Rapu",filters_label:"Tātari",zero_results:"Otinga kore ki [SEARCH_TERM]",many_results:"[COUNT] otinga ki [SEARCH_TERM]",one_result:"[COUNT] otinga ki [SEARCH_TERM]",alt_search:"Otinga kore ki [SEARCH_TERM]. Otinga kē ki [DIFFERENT_TERM]",search_suggestion:"Otinga kore ki [SEARCH_TERM]. whakamātau ki ngā mea atu:",searching:"Rapu ki [SEARCH_TERM]..."},Gl={thanks_to:rr,comments:sr,direction:lr,strings:ar},nr={};k(nr,{comments:()=>or,default:()=>Jl,direction:()=>_r,strings:()=>cr,thanks_to:()=>ir});var ir="Paul van Brouwershaven",or="",_r="ltr",cr={placeholder:"Zoeken",clear_search:"Reset",load_more:"Meer resultaten laden",search_label:"Doorzoek deze site",filters_label:"Filters",zero_results:"Geen resultaten voor [SEARCH_TERM]",many_results:"[COUNT] resultaten voor [SEARCH_TERM]",one_result:"[COUNT] resultaat voor [SEARCH_TERM]",alt_search:"Geen resultaten voor [SEARCH_TERM]. In plaats daarvan worden resultaten voor [DIFFERENT_TERM] weergegeven",search_suggestion:"Geen resultaten voor [SEARCH_TERM]. Probeer een van de volgende zoekopdrachten:",searching:"Zoeken naar [SEARCH_TERM]..."},Jl={thanks_to:ir,comments:or,direction:_r,strings:cr},fr={};k(fr,{comments:()=>dr,default:()=>Wl,direction:()=>hr,strings:()=>mr,thanks_to:()=>Er});var Er="Christopher Wingate",dr="",hr="ltr",mr={placeholder:"Søk",clear_search:"Fjern",load_more:"Last flere resultater",search_label:"Søk på denne siden",filters_label:"Filtre",zero_results:"Ingen resultater for [SEARCH_TERM]",many_results:"[COUNT] resultater for [SEARCH_TERM]",one_result:"[COUNT] resultat for [SEARCH_TERM]",alt_search:"Ingen resultater for [SEARCH_TERM]. Viser resultater for [DIFFERENT_TERM] i stedet",search_suggestion:"Ingen resultater for [SEARCH_TERM]. Prøv en av disse søkeordene i stedet:",searching:"Søker etter [SEARCH_TERM]"},Wl={thanks_to:Er,comments:dr,direction:hr,strings:mr},Cr={};k(Cr,{comments:()=>Rr,default:()=>Zl,direction:()=>Br,strings:()=>Ar,thanks_to:()=>gr});var gr="",Rr="",Br="ltr",Ar={placeholder:"Szukaj",clear_search:"Wyczyść",load_more:"Załaduj więcej",search_label:"Przeszukaj tę stronę",filters_label:"Filtry",zero_results:"Brak wyników dla [SEARCH_TERM]",many_results:"[COUNT] wyników dla [SEARCH_TERM]",one_result:"[COUNT] wynik dla [SEARCH_TERM]",alt_search:"Brak wyników dla [SEARCH_TERM]. Wyświetlam wyniki dla [DIFFERENT_TERM]",search_suggestion:"Brak wyników dla [SEARCH_TERM]. Pokrewne wyniki wyszukiwania:",searching:"Szukam [SEARCH_TERM]..."},Zl={thanks_to:gr,comments:Rr,direction:Br,strings:Ar},pr={};k(pr,{comments:()=>Tr,default:()=>Yl,direction:()=>kr,strings:()=>Fr,thanks_to:()=>vr});var vr="Jonatah",Tr="",kr="ltr",Fr={placeholder:"Pesquisar",clear_search:"Limpar",load_more:"Ver mais resultados",search_label:"Pesquisar",filters_label:"Filtros",zero_results:"Nenhum resultado encontrado para [SEARCH_TERM]",many_results:"[COUNT] resultados encontrados para [SEARCH_TERM]",one_result:"[COUNT] resultado encontrado para [SEARCH_TERM]",alt_search:"Nenhum resultado encontrado para [SEARCH_TERM]. Exibindo resultados para [DIFFERENT_TERM]",search_suggestion:"Nenhum resultado encontrado para [SEARCH_TERM]. Tente uma das seguintes pesquisas:",searching:"Pesquisando por [SEARCH_TERM]..."},Yl={thanks_to:vr,comments:Tr,direction:kr,strings:Fr},br={};k(br,{comments:()=>Sr,default:()=>Xl,direction:()=>Dr,strings:()=>Hr,thanks_to:()=>Mr});var Mr="Bogdan Mateescu <bogdan@surfverse.com>",Sr="",Dr="ltr",Hr={placeholder:"Căutare",clear_search:"Ştergeţi",load_more:"Încărcați mai multe rezultate",search_label:"Căutați în acest site",filters_label:"Filtre",zero_results:"Niciun rezultat pentru [SEARCH_TERM]",many_results:"[COUNT] rezultate pentru [SEARCH_TERM]",one_result:"[COUNT] rezultat pentru [SEARCH_TERM]",alt_search:"Niciun rezultat pentru [SEARCH_TERM]. Se afișează în schimb rezultatele pentru [DIFFERENT_TERM]",search_suggestion:"Niciun rezultat pentru [SEARCH_TERM]. Încercați una dintre următoarele căutări:",searching:"Se caută după: [SEARCH_TERM]..."},Xl={thanks_to:Mr,comments:Sr,direction:Dr,strings:Hr},wr={};k(wr,{comments:()=>Nr,default:()=>Ql,direction:()=>zr,strings:()=>jr,thanks_to:()=>yr});var yr="Aleksandr Gordeev",Nr="",zr="ltr",jr={placeholder:"Поиск",clear_search:"Очистить поле",load_more:"Загрузить еще",search_label:"Поиск по сайту",filters_label:"Фильтры",zero_results:"Ничего не найдено по запросу: [SEARCH_TERM]",many_results:"[COUNT] результатов по запросу: [SEARCH_TERM]",one_result:"[COUNT] результат по запросу: [SEARCH_TERM]",alt_search:"Ничего не найдено по запросу: [SEARCH_TERM]. Показаны результаты по запросу: [DIFFERENT_TERM]",search_suggestion:"Ничего не найдено по запросу: [SEARCH_TERM]. Попробуйте один из следующих вариантов",searching:"Поиск по запросу: [SEARCH_TERM]"},Ql={thanks_to:yr,comments:Nr,direction:zr,strings:jr},Or={};k(Or,{comments:()=>Ir,default:()=>$l,direction:()=>Pr,strings:()=>Lr,thanks_to:()=>Ur});var Ur="Andrija Sagicc",Ir="",Pr="ltr",Lr={placeholder:"Претрага",clear_search:"Брисање",load_more:"Приказ више резултата",search_label:"Претрага сајта",filters_label:"Филтери",zero_results:"Нема резултата за [SEARCH_TERM]",many_results:"[COUNT] резултата за [SEARCH_TERM]",one_result:"[COUNT] резултата за [SEARCH_TERM]",alt_search:"Нема резултата за [SEARCH_TERM]. Приказ додатник резултата за [DIFFERENT_TERM]",search_suggestion:"Нема резултата за [SEARCH_TERM]. Покушајте са неком од следећих претрага:",searching:"Претрага термина [SEARCH_TERM]..."},$l={thanks_to:Ur,comments:Ir,direction:Pr,strings:Lr},xr={};k(xr,{comments:()=>Vr,default:()=>ea,direction:()=>Kr,strings:()=>Gr,thanks_to:()=>qr});var qr="Montazar Al-Jaber <montazar@nanawee.tech>",Vr="",Kr="ltr",Gr={placeholder:"Sök",clear_search:"Rensa",load_more:"Visa fler träffar",search_label:"Sök på denna sida",filters_label:"Filter",zero_results:"[SEARCH_TERM] gav inga träffar",many_results:"[SEARCH_TERM] gav [COUNT] träffar",one_result:"[SEARCH_TERM] gav [COUNT] träff",alt_search:"[SEARCH_TERM] gav inga träffar. Visar resultat för [DIFFERENT_TERM] istället",search_suggestion:"[SEARCH_TERM] gav inga träffar. Försök igen med en av följande sökord:",searching:"Söker efter [SEARCH_TERM]..."},ea={thanks_to:qr,comments:Vr,direction:Kr,strings:Gr},Jr={};k(Jr,{comments:()=>Zr,default:()=>ua,direction:()=>Yr,strings:()=>Xr,thanks_to:()=>Wr});var Wr="Anonymous",Zr="",Yr="ltr",Xr={placeholder:"Tafuta",clear_search:"Futa",load_more:"Pakia matokeo zaidi",search_label:"Tafuta tovuti hii",filters_label:"Vichujio",zero_results:"Hakuna matokeo ya [SEARCH_TERM]",many_results:"Matokeo [COUNT] ya [SEARCH_TERM]",one_result:"Tokeo [COUNT] la [SEARCH_TERM]",alt_search:"Hakuna mayokeo ya [SEARCH_TERM]. Badala yake, inaonyesha matokeo ya [DIFFERENT_TERM]",search_suggestion:"Hakuna matokeo ya [SEARCH_TERM]. Jaribu mojawapo ya utafutaji ufuatao:",searching:"Kutafuta [SEARCH_TERM]..."},ua={thanks_to:Wr,comments:Zr,direction:Yr,strings:Xr},Qr={};k(Qr,{comments:()=>es,default:()=>ta,direction:()=>us,strings:()=>ts,thanks_to:()=>$r});var $r="",es="",us="ltr",ts={placeholder:"தேடுக",clear_search:"அழிக்குக",load_more:"மேலும் முடிவுகளைக் காட்டுக",search_label:"இந்த தளத்தில் தேடுக",filters_label:"வடிகட்டல்கள்",zero_results:"[SEARCH_TERM] க்கான முடிவுகள் இல்லை",many_results:"[SEARCH_TERM] க்கான [COUNT] முடிவுகள்",one_result:"[SEARCH_TERM] க்கான முடிவு",alt_search:"[SEARCH_TERM] இத்தேடலுக்கான முடிவுகள் இல்லை, இந்த தேடல்களுக்கான ஒத்த முடிவுகள் [DIFFERENT_TERM]",search_suggestion:"[SEARCH_TERM] இத் தேடலுக்கான முடிவுகள் இல்லை.இதற்கு பதிலீடான தேடல்களை தேடுக:",searching:"[SEARCH_TERM] தேடப்படுகின்றது"},ta={thanks_to:$r,comments:es,direction:us,strings:ts},rs={};k(rs,{comments:()=>ls,default:()=>ra,direction:()=>as,strings:()=>ns,thanks_to:()=>ss});var ss="Taylan Özgür Bildik",ls="",as="ltr",ns={placeholder:"Araştır",clear_search:"Temizle",load_more:"Daha fazla sonuç",search_label:"Site genelinde arama",filters_label:"Filtreler",zero_results:"[SEARCH_TERM] için sonuç yok",many_results:"[SEARCH_TERM] için [COUNT] sonuç bulundu",one_result:"[SEARCH_TERM] için [COUNT] sonuç bulundu",alt_search:"[SEARCH_TERM] için sonuç yok. Bunun yerine [DIFFERENT_TERM] için sonuçlar gösteriliyor",search_suggestion:"[SEARCH_TERM] için sonuç yok. Alternatif olarak aşağıdaki kelimelerden birini deneyebilirsiniz:",searching:"[SEARCH_TERM] araştırılıyor..."},ra={thanks_to:ss,comments:ls,direction:as,strings:ns},is={};k(is,{comments:()=>_s,default:()=>sa,direction:()=>cs,strings:()=>fs,thanks_to:()=>os});var os="Vladyslav Lyshenko <vladdnepr1989@gmail.com>",_s="",cs="ltr",fs={placeholder:"Пошук",clear_search:"Очистити поле",load_more:"Завантажити ще",search_label:"Пошук по сайту",filters_label:"Фільтри",zero_results:"Нічого не знайдено за запитом: [SEARCH_TERM]",many_results:"[COUNT] результатів на запит: [SEARCH_TERM]",one_result:"[COUNT] результат за запитом: [SEARCH_TERM]",alt_search:"Нічого не знайдено на запит: [SEARCH_TERM]. Показано результати на запит: [DIFFERENT_TERM]",search_suggestion:"Нічого не знайдено на запит: [SEARCH_TERM]. Спробуйте один із таких варіантів",searching:"Пошук за запитом: [SEARCH_TERM]"},sa={thanks_to:os,comments:_s,direction:cs,strings:fs},Es={};k(Es,{comments:()=>hs,default:()=>la,direction:()=>ms,strings:()=>Cs,thanks_to:()=>ds});var ds="Long Nhat Nguyen",hs="",ms="ltr",Cs={placeholder:"Tìm kiếm",clear_search:"Xóa",load_more:"Nhiều kết quả hơn",search_label:"Tìm kiếm trong trang này",filters_label:"Bộ lọc",zero_results:"Không tìm thấy kết quả cho [SEARCH_TERM]",many_results:"[COUNT] kết quả cho [SEARCH_TERM]",one_result:"[COUNT] kết quả cho [SEARCH_TERM]",alt_search:"Không tìm thấy kết quả cho [SEARCH_TERM]. Kiểm thị kết quả thay thế với [DIFFERENT_TERM]",search_suggestion:"Không tìm thấy kết quả cho [SEARCH_TERM]. Thử một trong các tìm kiếm:",searching:"Đang tìm kiếm cho [SEARCH_TERM]..."},la={thanks_to:ds,comments:hs,direction:ms,strings:Cs},gs={};k(gs,{comments:()=>Bs,default:()=>aa,direction:()=>As,strings:()=>ps,thanks_to:()=>Rs});var Rs="Amber Song",Bs="",As="ltr",ps={placeholder:"搜索",clear_search:"清除",load_more:"加载更多结果",search_label:"站内搜索",filters_label:"筛选",zero_results:"未找到 [SEARCH_TERM] 的相关结果",many_results:"找到 [COUNT] 个 [SEARCH_TERM] 的相关结果",one_result:"找到 [COUNT] 个 [SEARCH_TERM] 的相关结果",alt_search:"未找到 [SEARCH_TERM] 的相关结果。改为显示 [DIFFERENT_TERM] 的相关结果",search_suggestion:"未找到 [SEARCH_TERM] 的相关结果。请尝试以下搜索。",searching:"正在搜索 [SEARCH_TERM]..."},aa={thanks_to:Rs,comments:Bs,direction:As,strings:ps},vs={};k(vs,{comments:()=>ks,default:()=>na,direction:()=>Fs,strings:()=>bs,thanks_to:()=>Ts});var Ts="Amber Song",ks="",Fs="ltr",bs={placeholder:"搜索",clear_search:"清除",load_more:"加載更多結果",search_label:"站內搜索",filters_label:"篩選",zero_results:"未找到 [SEARCH_TERM] 的相關結果",many_results:"找到 [COUNT] 個 [SEARCH_TERM] 的相關結果",one_result:"找到 [COUNT] 個 [SEARCH_TERM] 的相關結果",alt_search:"未找到 [SEARCH_TERM] 的相關結果。改為顯示 [DIFFERENT_TERM] 的相關結果",search_suggestion:"未找到 [SEARCH_TERM] 的相關結果。請嘗試以下搜索。",searching:"正在搜索 [SEARCH_TERM]..."},na={thanks_to:Ts,comments:ks,direction:Fs,strings:bs},Ms={};k(Ms,{comments:()=>Ds,default:()=>ia,direction:()=>Hs,strings:()=>ws,thanks_to:()=>Ss});var Ss="Amber Song",Ds="",Hs="ltr",ws={placeholder:"搜索",clear_search:"清除",load_more:"加载更多结果",search_label:"站内搜索",filters_label:"筛选",zero_results:"未找到 [SEARCH_TERM] 的相关结果",many_results:"找到 [COUNT] 个 [SEARCH_TERM] 的相关结果",one_result:"找到 [COUNT] 个 [SEARCH_TERM] 的相关结果",alt_search:"未找到 [SEARCH_TERM] 的相关结果。改为显示 [DIFFERENT_TERM] 的相关结果",search_suggestion:"未找到 [SEARCH_TERM] 的相关结果。请尝试以下搜索。",searching:"正在搜索 [SEARCH_TERM]..."},ia={thanks_to:Ss,comments:Ds,direction:Hs,strings:ws},oa=[Bu,ku,Du,zu,Pu,Ku,Yu,ut,at,ct,mt,At,Ft,Ht,jt,Lt,Gt,Xt,tr,nr,fr,Cr,pr,br,wr,Or,xr,Jr,Qr,rs,is,Es,gs,vs,Ms],_a=oa,ca=["../../translations/af.json","../../translations/bn.json","../../translations/ca.json","../../translations/cs.json","../../translations/da.json","../../translations/de.json","../../translations/en.json","../../translations/es.json","../../translations/fi.json","../../translations/fr.json","../../translations/gl.json","../../translations/hi.json","../../translations/hr.json","../../translations/hu.json","../../translations/id.json","../../translations/it.json","../../translations/ja.json","../../translations/ko.json","../../translations/mi.json","../../translations/nl.json","../../translations/no.json","../../translations/pl.json","../../translations/pt.json","../../translations/ro.json","../../translations/ru.json","../../translations/sr.json","../../translations/sv.json","../../translations/sw.json","../../translations/ta.json","../../translations/tr.json","../../translations/uk.json","../../translations/vi.json","../../translations/zh-cn.json","../../translations/zh-tw.json","../../translations/zh.json"];function ou(e,t,u){const r=e.slice();return r[51]=t[u],r}function _u(e){let t,u,r;function s(a){e[37](a)}let l={show_empty_filters:e[5],open_filters:e[6],available_filters:e[18],translate:e[20],automatic_translations:e[19],translations:e[7]};return e[0]!==void 0&&(l.selected_filters=e[0]),t=new bl({props:l}),le.push(()=>il(t,"selected_filters",s)),{c(){Fe(t.$$.fragment)},m(a,n){Ee(t,a,n),r=!0},p(a,n){const i={};n[0]&32&&(i.show_empty_filters=a[5]),n[0]&64&&(i.open_filters=a[6]),n[0]&262144&&(i.available_filters=a[18]),n[0]&524288&&(i.automatic_translations=a[19]),n[0]&128&&(i.translations=a[7]),!u&&n[0]&1&&(u=!0,i.selected_filters=a[0],rl(()=>u=!1)),t.$set(i)},i(a){r||(z(t.$$.fragment,a),r=!0)},o(a){U(t.$$.fragment,a),r=!1},d(a){de(t,a)}}}function cu(e){let t,u,r,s;const l=[Ea,fa],a=[];function n(i,d){return i[14]?0:1}return u=n(e),r=a[u]=l[u](e),{c(){t=p("div"),r.c(),g(t,"class","pagefind-ui__results-area svelte-e9gkc3")},m(i,d){T(i,t,d),a[u].m(t,null),s=!0},p(i,d){let _=u;u=n(i),u===_?a[u].p(i,d):(ae(),U(a[_],1,1,()=>{a[_]=null}),ne(),r=a[u],r?r.p(i,d):(r=a[u]=l[u](i),r.c()),z(r,1),r.m(t,null))},i(i){s||(z(r),s=!0)},o(i){U(r),s=!1},d(i){i&&v(t),a[u].d()}}}function fa(e){let t,u,r,s=[],l=new Map,a,n,i;function d(o,E){return o[13].results.length===0?ma:o[13].results.length===1?ha:da}let _=d(e),h=_(e),m=e[13].results.slice(0,e[17]);const f=o=>o[51].id;for(let o=0;o<m.length;o+=1){let E=ou(e,m,o),B=f(E);l.set(B,s[o]=fu(B,E))}let c=e[13].results.length>e[17]&&Eu(e);return{c(){t=p("p"),h.c(),u=M(),r=p("ol");for(let o=0;o<s.length;o+=1)s[o].c();a=M(),c&&c.c(),n=ee(),g(t,"class","pagefind-ui__message svelte-e9gkc3"),g(r,"class","pagefind-ui__results svelte-e9gkc3")},m(o,E){T(o,t,E),h.m(t,null),T(o,u,E),T(o,r,E);for(let B=0;B<s.length;B+=1)s[B]&&s[B].m(r,null);T(o,a,E),c&&c.m(o,E),T(o,n,E),i=!0},p(o,E){_===(_=d(o))&&h?h.p(o,E):(h.d(1),h=_(o),h&&(h.c(),h.m(t,null))),E[0]&139292&&(m=o[13].results.slice(0,o[17]),ae(),s=nl(s,E,f,1,o,m,l,r,al,fu,null,ou),ne()),o[13].results.length>o[17]?c?c.p(o,E):(c=Eu(o),c.c(),c.m(n.parentNode,n)):c&&(c.d(1),c=null)},i(o){if(!i){for(let E=0;E<m.length;E+=1)z(s[E]);i=!0}},o(o){for(let E=0;E<s.length;E+=1)U(s[E]);i=!1},d(o){o&&v(t),h.d(),o&&v(u),o&&v(r);for(let E=0;E<s.length;E+=1)s[E].d();o&&v(a),c&&c.d(o),o&&v(n)}}}function Ea(e){let t,u=e[16]&&du(e);return{c(){u&&u.c(),t=ee()},m(r,s){u&&u.m(r,s),T(r,t,s)},p(r,s){r[16]?u?u.p(r,s):(u=du(r),u.c(),u.m(t.parentNode,t)):u&&(u.d(1),u=null)},i:P,o:P,d(r){u&&u.d(r),r&&v(t)}}}function da(e){let t=e[20]("many_results",e[19],e[7]).replace(/\[SEARCH_TERM\]/,e[16]).replace(/\[COUNT\]/,new Intl.NumberFormat(e[7].language).format(e[13].results.length))+"",u;return{c(){u=S(t)},m(r,s){T(r,u,s)},p(r,s){s[0]&598144&&t!==(t=r[20]("many_results",r[19],r[7]).replace(/\[SEARCH_TERM\]/,r[16]).replace(/\[COUNT\]/,new Intl.NumberFormat(r[7].language).format(r[13].results.length))+"")&&j(u,t)},d(r){r&&v(u)}}}function ha(e){let t=e[20]("one_result",e[19],e[7]).replace(/\[SEARCH_TERM\]/,e[16]).replace(/\[COUNT\]/,new Intl.NumberFormat(e[7].language).format(1))+"",u;return{c(){u=S(t)},m(r,s){T(r,u,s)},p(r,s){s[0]&589952&&t!==(t=r[20]("one_result",r[19],r[7]).replace(/\[SEARCH_TERM\]/,r[16]).replace(/\[COUNT\]/,new Intl.NumberFormat(r[7].language).format(1))+"")&&j(u,t)},d(r){r&&v(u)}}}function ma(e){let t=e[20]("zero_results",e[19],e[7]).replace(/\[SEARCH_TERM\]/,e[16])+"",u;return{c(){u=S(t)},m(r,s){T(r,u,s)},p(r,s){s[0]&589952&&t!==(t=r[20]("zero_results",r[19],r[7]).replace(/\[SEARCH_TERM\]/,r[16])+"")&&j(u,t)},d(r){r&&v(u)}}}function Ca(e){let t,u;return t=new Cl({props:{show_images:e[2],process_result:e[4],result:e[51]}}),{c(){Fe(t.$$.fragment)},m(r,s){Ee(t,r,s),u=!0},p(r,s){const l={};s[0]&4&&(l.show_images=r[2]),s[0]&16&&(l.process_result=r[4]),s[0]&139264&&(l.result=r[51]),t.$set(l)},i(r){u||(z(t.$$.fragment,r),u=!0)},o(r){U(t.$$.fragment,r),u=!1},d(r){de(t,r)}}}function ga(e){let t,u;return t=new vl({props:{show_images:e[2],process_result:e[4],result:e[51]}}),{c(){Fe(t.$$.fragment)},m(r,s){Ee(t,r,s),u=!0},p(r,s){const l={};s[0]&4&&(l.show_images=r[2]),s[0]&16&&(l.process_result=r[4]),s[0]&139264&&(l.result=r[51]),t.$set(l)},i(r){u||(z(t.$$.fragment,r),u=!0)},o(r){U(t.$$.fragment,r),u=!1},d(r){de(t,r)}}}function fu(e,t){let u,r,s,l,a;const n=[ga,Ca],i=[];function d(_,h){return _[3]?0:1}return r=d(t),s=i[r]=n[r](t),{key:e,first:null,c(){u=ee(),s.c(),l=ee(),this.first=u},m(_,h){T(_,u,h),i[r].m(_,h),T(_,l,h),a=!0},p(_,h){t=_;let m=r;r=d(t),r===m?i[r].p(t,h):(ae(),U(i[m],1,1,()=>{i[m]=null}),ne(),s=i[r],s?s.p(t,h):(s=i[r]=n[r](t),s.c()),z(s,1),s.m(l.parentNode,l))},i(_){a||(z(s),a=!0)},o(_){U(s),a=!1},d(_){_&&v(u),i[r].d(_),_&&v(l)}}}function Eu(e){let t,u=e[20]("load_more",e[19],e[7])+"",r,s,l;return{c(){t=p("button"),r=S(u),g(t,"type","button"),g(t,"class","pagefind-ui__button svelte-e9gkc3")},m(a,n){T(a,t,n),A(t,r),s||(l=G(t,"click",e[22]),s=!0)},p(a,n){n[0]&524416&&u!==(u=a[20]("load_more",a[19],a[7])+"")&&j(r,u)},d(a){a&&v(t),s=!1,l()}}}function du(e){let t,u=e[20]("searching",e[19],e[7]).replace(/\[SEARCH_TERM\]/,e[16])+"",r;return{c(){t=p("p"),r=S(u),g(t,"class","pagefind-ui__message svelte-e9gkc3")},m(s,l){T(s,t,l),A(t,r)},p(s,l){l[0]&589952&&u!==(u=s[20]("searching",s[19],s[7]).replace(/\[SEARCH_TERM\]/,s[16])+"")&&j(r,u)},d(s){s&&v(t)}}}function Ra(e){let t,u,r,s,l,a,n=e[20]("clear_search",e[19],e[7])+"",i,d,_,h,m,f,c,o,E=e[12]&&_u(e),B=e[15]&&cu(e);return{c(){t=p("div"),u=p("form"),r=p("input"),l=M(),a=p("button"),i=S(n),d=M(),_=p("div"),E&&E.c(),h=M(),B&&B.c(),g(r,"class","pagefind-ui__search-input svelte-e9gkc3"),g(r,"type","text"),g(r,"placeholder",s=e[20]("placeholder",e[19],e[7])),g(r,"autocapitalize","none"),g(r,"enterkeyhint","search"),r.autofocus=e[8],g(a,"class","pagefind-ui__search-clear svelte-e9gkc3"),K(a,"pagefind-ui__suppressed",!e[9]),g(_,"class","pagefind-ui__drawer svelte-e9gkc3"),K(_,"pagefind-ui__hidden",!e[15]),g(u,"class","pagefind-ui__form svelte-e9gkc3"),g(u,"role","search"),g(u,"aria-label",m=e[20]("search_label",e[19],e[7])),g(u,"action","javascript:void(0);"),g(t,"class","pagefind-ui svelte-e9gkc3"),K(t,"pagefind-ui--reset",e[1])},m(R,F){T(R,t,F),A(t,u),A(u,r),ze(r,e[9]),e[34](r),A(u,l),A(u,a),A(a,i),e[35](a),A(u,d),A(u,_),E&&E.m(_,null),A(_,h),B&&B.m(_,null),f=!0,e[8]&&r.focus(),c||(o=[G(r,"focus",e[21]),G(r,"keydown",e[32]),G(r,"input",e[33]),G(a,"click",e[36]),G(u,"submit",Ba)],c=!0)},p(R,F){(!f||F[0]&524416&&s!==(s=R[20]("placeholder",R[19],R[7])))&&g(r,"placeholder",s),(!f||F[0]&256)&&(r.autofocus=R[8]),F[0]&512&&r.value!==R[9]&&ze(r,R[9]),(!f||F[0]&524416)&&n!==(n=R[20]("clear_search",R[19],R[7])+"")&&j(i,n),(!f||F[0]&512)&&K(a,"pagefind-ui__suppressed",!R[9]),R[12]?E?(E.p(R,F),F[0]&4096&&z(E,1)):(E=_u(R),E.c(),z(E,1),E.m(_,h)):E&&(ae(),U(E,1,1,()=>{E=null}),ne()),R[15]?B?(B.p(R,F),F[0]&32768&&z(B,1)):(B=cu(R),B.c(),z(B,1),B.m(_,null)):B&&(ae(),U(B,1,1,()=>{B=null}),ne()),(!f||F[0]&32768)&&K(_,"pagefind-ui__hidden",!R[15]),(!f||F[0]&524416&&m!==(m=R[20]("search_label",R[19],R[7])))&&g(u,"aria-label",m),(!f||F[0]&2)&&K(t,"pagefind-ui--reset",R[1])},i(R){f||(z(E),z(B),f=!0)},o(R){U(E),U(B),f=!1},d(R){R&&v(t),e[34](null),e[35](null),E&&E.d(),B&&B.d(),c=!1,W(o)}}}var Ba=e=>e.preventDefault();function Aa(e,t,u){const r={},s=ca.map(C=>C.match(/([^\/]+)\.json$/)[1]);for(let C=0;C<s.length;C++)r[s[C]]={language:s[C],..._a[C].strings};let{base_path:l="/pagefind/"}=t,{page_size:a=5}=t,{reset_styles:n=!0}=t,{show_images:i=!0}=t,{show_sub_results:d=!1}=t,{excerpt_length:_}=t,{process_result:h=null}=t,{process_term:m=null}=t,{show_empty_filters:f=!0}=t,{open_filters:c=[]}=t,{debounce_timeout_ms:o=300}=t,{pagefind_options:E={}}=t,{merge_index:B=[]}=t,{trigger_search_term:R=""}=t,{translations:F={}}=t,{autofocus:N=!1}=t,{sort:q=null}=t,{selected_filters:L={}}=t,b="",D,w,x,ys=40,Ce=!1,be=[],ge=!1,Re=!1,Me=0,Se="",Be=a,De=null,ue=null,He=r.en;const Ns=(C,H,y)=>y[C]??H[C]??"";$s(()=>{let C=document?.querySelector?.("html")?.getAttribute?.("lang")||"en",H=Ru(C.toLocaleLowerCase());u(19,He=r[`${H.language}-${H.script}-${H.region}`]||r[`${H.language}-${H.region}`]||r[`${H.language}`]||r.en)}),el(()=>{D?.destroy?.(),D=null});const we=async()=>{if(!Ce&&(u(12,Ce=!0),!D)){let C;try{C=await Js(()=>import(`${l}pagefind.js`),[])}catch(y){console.error(y),console.error([`Pagefind couldn't be loaded from ${this.options.bundlePath}pagefind.js`,"You can configure this by passing a bundlePath option to PagefindUI"].join(`
+import{_ as Js}from"./hoisted.zHsgHwcm.js";import"./Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js";var Ws=Object.defineProperty,k=(e,t)=>{for(var u in t)Ws(e,u,{get:t[u],enumerable:!0})};function P(){}function hu(e){return e()}function Ne(){return Object.create(null)}function W(e){e.forEach(hu)}function mu(e){return typeof e=="function"}function fe(e,t){return e!=e?t==t:e!==t||e&&typeof e=="object"||typeof e=="function"}var oe;function ce(e,t){return oe||(oe=document.createElement("a")),oe.href=t,e===oe.href}function Zs(e){return Object.keys(e).length===0}function A(e,t){e.appendChild(t)}function T(e,t,u){e.insertBefore(t,u||null)}function v(e){e.parentNode&&e.parentNode.removeChild(e)}function ie(e,t){for(let u=0;u<e.length;u+=1)e[u]&&e[u].d(t)}function p(e){return document.createElement(e)}function Ys(e){return document.createElementNS("http://www.w3.org/2000/svg",e)}function S(e){return document.createTextNode(e)}function M(){return S(" ")}function ee(){return S("")}function G(e,t,u,r){return e.addEventListener(t,u,r),()=>e.removeEventListener(t,u,r)}function g(e,t,u){u==null?e.removeAttribute(t):e.getAttribute(t)!==u&&e.setAttribute(t,u)}function Xs(e){return Array.from(e.childNodes)}function j(e,t){t=""+t,e.data!==t&&(e.data=t)}function ze(e,t){e.value=t??""}function K(e,t,u){e.classList[u?"add":"remove"](t)}var Qs=class{constructor(e=!1){this.is_svg=!1,this.is_svg=e,this.e=this.n=null}c(e){this.h(e)}m(e,t,u=null){this.e||(this.is_svg?this.e=Ys(t.nodeName):this.e=p(t.nodeType===11?"TEMPLATE":t.nodeName),this.t=t.tagName!=="TEMPLATE"?t:t.content,this.c(e)),this.i(u)}h(e){this.e.innerHTML=e,this.n=Array.from(this.e.nodeName==="TEMPLATE"?this.e.content.childNodes:this.e.childNodes)}i(e){for(let t=0;t<this.n.length;t+=1)T(this.t,this.n[t],e)}p(e){this.d(),this.h(e),this.i(this.a)}d(){this.n.forEach(v)}},se;function re(e){se=e}function Cu(){if(!se)throw new Error("Function called outside component initialization");return se}function $s(e){Cu().$$.on_mount.push(e)}function el(e){Cu().$$.on_destroy.push(e)}var X=[],le=[],$=[],pe=[],ul=Promise.resolve(),ve=!1;function tl(){ve||(ve=!0,ul.then(gu))}function Te(e){$.push(e)}function rl(e){pe.push(e)}var Ae=new Set,Y=0;function gu(){if(Y!==0)return;const e=se;do{try{for(;Y<X.length;){const t=X[Y];Y++,re(t),sl(t.$$)}}catch(t){throw X.length=0,Y=0,t}for(re(null),X.length=0,Y=0;le.length;)le.pop()();for(let t=0;t<$.length;t+=1){const u=$[t];Ae.has(u)||(Ae.add(u),u())}$.length=0}while(X.length);for(;pe.length;)pe.pop()();ve=!1,Ae.clear(),re(e)}function sl(e){if(e.fragment!==null){e.update(),W(e.before_update);const t=e.dirty;e.dirty=[-1],e.fragment&&e.fragment.p(e.ctx,t),e.after_update.forEach(Te)}}function ll(e){const t=[],u=[];$.forEach(r=>e.indexOf(r)===-1?t.push(r):u.push(r)),u.forEach(r=>r()),$=t}var _e=new Set,J;function ae(){J={r:0,c:[],p:J}}function ne(){J.r||W(J.c),J=J.p}function z(e,t){e&&e.i&&(_e.delete(e),e.i(t))}function U(e,t,u,r){if(e&&e.o){if(_e.has(e))return;_e.add(e),J.c.push(()=>{_e.delete(e),r&&(u&&e.d(1),r())}),e.o(t)}else r&&r()}function al(e,t){U(e,1,1,()=>{t.delete(e.key)})}function nl(e,t,u,r,s,l,a,n,i,d,_,h){let m=e.length,f=l.length,c=m;const o={};for(;c--;)o[e[c].key]=c;const E=[],B=new Map,R=new Map,F=[];for(c=f;c--;){const b=h(s,l,c),D=u(b);let w=a.get(D);w?F.push(()=>w.p(b,t)):(w=d(D,b),w.c()),B.set(D,E[c]=w),D in o&&R.set(D,Math.abs(c-o[D]))}const N=new Set,q=new Set;function L(b){z(b,1),b.m(n,_),a.set(b.key,b),_=b.first,f--}for(;m&&f;){const b=E[f-1],D=e[m-1],w=b.key,x=D.key;b===D?(_=b.first,m--,f--):B.has(x)?!a.has(w)||N.has(w)?L(b):q.has(x)?m--:R.get(w)>R.get(x)?(q.add(w),L(b)):(N.add(x),m--):(i(D,a),m--)}for(;m--;){const b=e[m];B.has(b.key)||i(b,a)}for(;f;)L(E[f-1]);return W(F),E}function il(e,t,u){const r=e.$$.props[t];r!==void 0&&(e.$$.bound[r]=u,u(e.$$.ctx[r]))}function Fe(e){e&&e.c()}function Ee(e,t,u,r){const{fragment:s,after_update:l}=e.$$;s&&s.m(t,u),r||Te(()=>{const a=e.$$.on_mount.map(hu).filter(mu);e.$$.on_destroy?e.$$.on_destroy.push(...a):W(a),e.$$.on_mount=[]}),l.forEach(Te)}function de(e,t){const u=e.$$;u.fragment!==null&&(ll(u.after_update),W(u.on_destroy),u.fragment&&u.fragment.d(t),u.on_destroy=u.fragment=null,u.ctx=[])}function ol(e,t){e.$$.dirty[0]===-1&&(X.push(e),tl(),e.$$.dirty.fill(0)),e.$$.dirty[t/31|0]|=1<<t%31}function he(e,t,u,r,s,l,a,n=[-1]){const i=se;re(e);const d=e.$$={fragment:null,ctx:[],props:l,update:P,not_equal:s,bound:Ne(),on_mount:[],on_destroy:[],on_disconnect:[],before_update:[],after_update:[],context:new Map(t.context||(i?i.$$.context:[])),callbacks:Ne(),dirty:n,skip_bound:!1,root:t.target||i.$$.root};a&&a(d.root);let _=!1;if(d.ctx=u?u(e,t.props||{},(h,m,...f)=>{const c=f.length?f[0]:m;return d.ctx&&s(d.ctx[h],d.ctx[h]=c)&&(!d.skip_bound&&d.bound[h]&&d.bound[h](c),_&&ol(e,h)),m}):[],d.update(),_=!0,W(d.before_update),d.fragment=r?r(d.ctx):!1,t.target){if(t.hydrate){const h=Xs(t.target);d.fragment&&d.fragment.l(h),h.forEach(v)}else d.fragment&&d.fragment.c();t.intro&&z(e.$$.fragment),Ee(e,t.target,t.anchor,t.customElement),gu()}re(i)}var me=class{$destroy(){de(this,1),this.$destroy=P}$on(e,t){if(!mu(t))return P;const u=this.$$.callbacks[e]||(this.$$.callbacks[e]=[]);return u.push(t),()=>{const r=u.indexOf(t);r!==-1&&u.splice(r,1)}}$set(e){this.$$set&&!Zs(e)&&(this.$$.skip_bound=!0,this.$$set(e),this.$$.skip_bound=!1)}};function O(e){const t=typeof e=="string"?e.charCodeAt(0):e;return t>=97&&t<=122||t>=65&&t<=90}function Q(e){const t=typeof e=="string"?e.charCodeAt(0):e;return t>=48&&t<=57}function V(e){return O(e)||Q(e)}var _l=["art-lojban","cel-gaulish","no-bok","no-nyn","zh-guoyu","zh-hakka","zh-min","zh-min-nan","zh-xiang"],je={"en-gb-oed":"en-GB-oxendict","i-ami":"ami","i-bnn":"bnn","i-default":null,"i-enochian":null,"i-hak":"hak","i-klingon":"tlh","i-lux":"lb","i-mingo":null,"i-navajo":"nv","i-pwn":"pwn","i-tao":"tao","i-tay":"tay","i-tsu":"tsu","sgn-be-fr":"sfb","sgn-be-nl":"vgt","sgn-ch-de":"sgg","art-lojban":"jbo","cel-gaulish":null,"no-bok":"nb","no-nyn":"nn","zh-guoyu":"cmn","zh-hakka":"hak","zh-min":null,"zh-min-nan":"nan","zh-xiang":"hsn"},cl={}.hasOwnProperty;function Ru(e,t={}){const u=Oe(),r=String(e),s=r.toLowerCase();let l=0;if(e==null)throw new Error("Expected string, got `"+e+"`");if(cl.call(je,s)){const n=je[s];return(t.normalize===void 0||t.normalize===null||t.normalize)&&typeof n=="string"?Ru(n):(u[_l.includes(s)?"regular":"irregular"]=r,u)}for(;O(s.charCodeAt(l))&&l<9;)l++;if(l>1&&l<9){if(u.language=r.slice(0,l),l<4){let n=0;for(;s.charCodeAt(l)===45&&O(s.charCodeAt(l+1))&&O(s.charCodeAt(l+2))&&O(s.charCodeAt(l+3))&&!O(s.charCodeAt(l+4));){if(n>2)return a(l,3,"Too many extended language subtags, expected at most 3 subtags");u.extendedLanguageSubtags.push(r.slice(l+1,l+4)),l+=4,n++}}for(s.charCodeAt(l)===45&&O(s.charCodeAt(l+1))&&O(s.charCodeAt(l+2))&&O(s.charCodeAt(l+3))&&O(s.charCodeAt(l+4))&&!O(s.charCodeAt(l+5))&&(u.script=r.slice(l+1,l+5),l+=5),s.charCodeAt(l)===45&&(O(s.charCodeAt(l+1))&&O(s.charCodeAt(l+2))&&!O(s.charCodeAt(l+3))?(u.region=r.slice(l+1,l+3),l+=3):Q(s.charCodeAt(l+1))&&Q(s.charCodeAt(l+2))&&Q(s.charCodeAt(l+3))&&!Q(s.charCodeAt(l+4))&&(u.region=r.slice(l+1,l+4),l+=4));s.charCodeAt(l)===45;){const n=l+1;let i=n;for(;V(s.charCodeAt(i));){if(i-n>7)return a(i,1,"Too long variant, expected at most 8 characters");i++}if(i-n>4||i-n>3&&Q(s.charCodeAt(n)))u.variants.push(r.slice(n,i)),l=i;else break}for(;s.charCodeAt(l)===45&&!(s.charCodeAt(l+1)===120||!V(s.charCodeAt(l+1))||s.charCodeAt(l+2)!==45||!V(s.charCodeAt(l+3)));){let n=l+2,i=0;for(;s.charCodeAt(n)===45&&V(s.charCodeAt(n+1))&&V(s.charCodeAt(n+2));){const d=n+1;for(n=d+2,i++;V(s.charCodeAt(n));){if(n-d>7)return a(n,2,"Too long extension, expected at most 8 characters");n++}}if(!i)return a(n,4,"Empty extension, extensions must have at least 2 characters of content");u.extensions.push({singleton:r.charAt(l+1),extensions:r.slice(l+3,n).split("-")}),l=n}}else l=0;if(l===0&&s.charCodeAt(l)===120||s.charCodeAt(l)===45&&s.charCodeAt(l+1)===120){l=l?l+2:1;let n=l;for(;s.charCodeAt(n)===45&&V(s.charCodeAt(n+1));){const i=l+1;for(n=i;V(s.charCodeAt(n));){if(n-i>7)return a(n,5,"Too long private-use area, expected at most 8 characters");n++}u.privateuse.push(r.slice(l+1,n)),l=n}}if(l!==r.length)return a(l,6,"Found superfluous content after tag");return u;function a(n,i,d){return t.warning&&t.warning(d,i,n),t.forgiving?u:Oe()}}function Oe(){return{language:null,extendedLanguageSubtags:[],script:null,region:null,variants:[],extensions:[],privateuse:[],irregular:null,regular:null}}function Ue(e,t,u){const r=e.slice();return r[8]=t[u][0],r[9]=t[u][1],r}function fl(e){let t,u,r,s,l,a=e[0]&&Ie();return{c(){a&&a.c(),t=M(),u=p("div"),r=p("p"),r.textContent=`${e[3](30)}`,s=M(),l=p("p"),l.textContent=`${e[3](40)}`,g(r,"class","pagefind-ui__result-title pagefind-ui__loading svelte-j9e30"),g(l,"class","pagefind-ui__result-excerpt pagefind-ui__loading svelte-j9e30"),g(u,"class","pagefind-ui__result-inner svelte-j9e30")},m(n,i){a&&a.m(n,i),T(n,t,i),T(n,u,i),A(u,r),A(u,s),A(u,l)},p(n,i){n[0]?a||(a=Ie(),a.c(),a.m(t.parentNode,t)):a&&(a.d(1),a=null)},d(n){a&&a.d(n),n&&v(t),n&&v(u)}}}function El(e){let t,u,r,s,l=e[1].meta?.title+"",a,n,i,d,_=e[1].excerpt+"",h,m=e[0]&&Pe(e),f=e[2].length&&xe(e);return{c(){m&&m.c(),t=M(),u=p("div"),r=p("p"),s=p("a"),a=S(l),i=M(),d=p("p"),h=M(),f&&f.c(),g(s,"class","pagefind-ui__result-link svelte-j9e30"),g(s,"href",n=e[1].meta?.url||e[1].url),g(r,"class","pagefind-ui__result-title svelte-j9e30"),g(d,"class","pagefind-ui__result-excerpt svelte-j9e30"),g(u,"class","pagefind-ui__result-inner svelte-j9e30")},m(c,o){m&&m.m(c,o),T(c,t,o),T(c,u,o),A(u,r),A(r,s),A(s,a),A(u,i),A(u,d),d.innerHTML=_,A(u,h),f&&f.m(u,null)},p(c,o){c[0]?m?m.p(c,o):(m=Pe(c),m.c(),m.m(t.parentNode,t)):m&&(m.d(1),m=null),o&2&&l!==(l=c[1].meta?.title+"")&&j(a,l),o&2&&n!==(n=c[1].meta?.url||c[1].url)&&g(s,"href",n),o&2&&_!==(_=c[1].excerpt+"")&&(d.innerHTML=_),c[2].length?f?f.p(c,o):(f=xe(c),f.c(),f.m(u,null)):f&&(f.d(1),f=null)},d(c){m&&m.d(c),c&&v(t),c&&v(u),f&&f.d()}}}function Ie(e){let t;return{c(){t=p("div"),g(t,"class","pagefind-ui__result-thumb pagefind-ui__loading svelte-j9e30")},m(u,r){T(u,t,r)},d(u){u&&v(t)}}}function Pe(e){let t,u=e[1].meta.image&&Le(e);return{c(){t=p("div"),u&&u.c(),g(t,"class","pagefind-ui__result-thumb svelte-j9e30")},m(r,s){T(r,t,s),u&&u.m(t,null)},p(r,s){r[1].meta.image?u?u.p(r,s):(u=Le(r),u.c(),u.m(t,null)):u&&(u.d(1),u=null)},d(r){r&&v(t),u&&u.d()}}}function Le(e){let t,u,r;return{c(){t=p("img"),g(t,"class","pagefind-ui__result-image svelte-j9e30"),ce(t.src,u=e[1].meta?.image)||g(t,"src",u),g(t,"alt",r=e[1].meta?.image_alt||e[1].meta?.title)},m(s,l){T(s,t,l)},p(s,l){l&2&&!ce(t.src,u=s[1].meta?.image)&&g(t,"src",u),l&2&&r!==(r=s[1].meta?.image_alt||s[1].meta?.title)&&g(t,"alt",r)},d(s){s&&v(t)}}}function xe(e){let t,u=e[2],r=[];for(let s=0;s<u.length;s+=1)r[s]=qe(Ue(e,u,s));return{c(){t=p("ul");for(let s=0;s<r.length;s+=1)r[s].c();g(t,"class","pagefind-ui__result-tags svelte-j9e30")},m(s,l){T(s,t,l);for(let a=0;a<r.length;a+=1)r[a]&&r[a].m(t,null)},p(s,l){if(l&4){u=s[2];let a;for(a=0;a<u.length;a+=1){const n=Ue(s,u,a);r[a]?r[a].p(n,l):(r[a]=qe(n),r[a].c(),r[a].m(t,null))}for(;a<r.length;a+=1)r[a].d(1);r.length=u.length}},d(s){s&&v(t),ie(r,s)}}}function qe(e){let t,u=e[8].replace(/^(\w)/,Ve)+"",r,s,l=e[9]+"",a,n;return{c(){t=p("li"),r=S(u),s=S(": "),a=S(l),n=M(),g(t,"class","pagefind-ui__result-tag svelte-j9e30")},m(i,d){T(i,t,d),A(t,r),A(t,s),A(t,a),A(t,n)},p(i,d){d&4&&u!==(u=i[8].replace(/^(\w)/,Ve)+"")&&j(r,u),d&4&&l!==(l=i[9]+"")&&j(a,l)},d(i){i&&v(t)}}}function dl(e){let t;function u(l,a){return l[1]?El:fl}let r=u(e),s=r(e);return{c(){t=p("li"),s.c(),g(t,"class","pagefind-ui__result svelte-j9e30")},m(l,a){T(l,t,a),s.m(t,null)},p(l,[a]){r===(r=u(l))&&s?s.p(l,a):(s.d(1),s=r(l),s&&(s.c(),s.m(t,null)))},i:P,o:P,d(l){l&&v(t),s.d()}}}var Ve=e=>e.toLocaleUpperCase();function hl(e,t,u){let{show_images:r=!0}=t,{process_result:s=null}=t,{result:l={data:async()=>{}}}=t;const a=["title","image","image_alt","url"];let n,i=[];const d=async h=>{u(1,n=await h.data()),u(1,n=s?.(n)??n),u(2,i=Object.entries(n.meta).filter(([m])=>!a.includes(m)))},_=(h=30)=>". ".repeat(Math.floor(10+Math.random()*h));return e.$$set=h=>{"show_images"in h&&u(0,r=h.show_images),"process_result"in h&&u(4,s=h.process_result),"result"in h&&u(5,l=h.result)},e.$$.update=()=>{e.$$.dirty&32&&d(l)},[r,n,i,_,s,l]}var ml=class extends me{constructor(e){super(),he(this,e,hl,dl,fe,{show_images:0,process_result:4,result:5})}},Cl=ml;function Ke(e,t,u){const r=e.slice();return r[11]=t[u][0],r[12]=t[u][1],r}function Ge(e,t,u){const r=e.slice();return r[15]=t[u],r}function gl(e){let t,u,r,s,l,a=e[0]&&Je();return{c(){a&&a.c(),t=M(),u=p("div"),r=p("p"),r.textContent=`${e[5](30)}`,s=M(),l=p("p"),l.textContent=`${e[5](40)}`,g(r,"class","pagefind-ui__result-title pagefind-ui__loading svelte-4xnkmf"),g(l,"class","pagefind-ui__result-excerpt pagefind-ui__loading svelte-4xnkmf"),g(u,"class","pagefind-ui__result-inner svelte-4xnkmf")},m(n,i){a&&a.m(n,i),T(n,t,i),T(n,u,i),A(u,r),A(u,s),A(u,l)},p(n,i){n[0]?a||(a=Je(),a.c(),a.m(t.parentNode,t)):a&&(a.d(1),a=null)},d(n){a&&a.d(n),n&&v(t),n&&v(u)}}}function Rl(e){let t,u,r,s,l=e[1].meta?.title+"",a,n,i,d,_,h=e[0]&&We(e),m=e[4]&&Ye(e),f=e[3],c=[];for(let E=0;E<f.length;E+=1)c[E]=Xe(Ge(e,f,E));let o=e[2].length&&Qe(e);return{c(){h&&h.c(),t=M(),u=p("div"),r=p("p"),s=p("a"),a=S(l),i=M(),m&&m.c(),d=M();for(let E=0;E<c.length;E+=1)c[E].c();_=M(),o&&o.c(),g(s,"class","pagefind-ui__result-link svelte-4xnkmf"),g(s,"href",n=e[1].meta?.url||e[1].url),g(r,"class","pagefind-ui__result-title svelte-4xnkmf"),g(u,"class","pagefind-ui__result-inner svelte-4xnkmf")},m(E,B){h&&h.m(E,B),T(E,t,B),T(E,u,B),A(u,r),A(r,s),A(s,a),A(u,i),m&&m.m(u,null),A(u,d);for(let R=0;R<c.length;R+=1)c[R]&&c[R].m(u,null);A(u,_),o&&o.m(u,null)},p(E,B){if(E[0]?h?h.p(E,B):(h=We(E),h.c(),h.m(t.parentNode,t)):h&&(h.d(1),h=null),B&2&&l!==(l=E[1].meta?.title+"")&&j(a,l),B&2&&n!==(n=E[1].meta?.url||E[1].url)&&g(s,"href",n),E[4]?m?m.p(E,B):(m=Ye(E),m.c(),m.m(u,d)):m&&(m.d(1),m=null),B&8){f=E[3];let R;for(R=0;R<f.length;R+=1){const F=Ge(E,f,R);c[R]?c[R].p(F,B):(c[R]=Xe(F),c[R].c(),c[R].m(u,_))}for(;R<c.length;R+=1)c[R].d(1);c.length=f.length}E[2].length?o?o.p(E,B):(o=Qe(E),o.c(),o.m(u,null)):o&&(o.d(1),o=null)},d(E){h&&h.d(E),E&&v(t),E&&v(u),m&&m.d(),ie(c,E),o&&o.d()}}}function Je(e){let t;return{c(){t=p("div"),g(t,"class","pagefind-ui__result-thumb pagefind-ui__loading svelte-4xnkmf")},m(u,r){T(u,t,r)},d(u){u&&v(t)}}}function We(e){let t,u=e[1].meta.image&&Ze(e);return{c(){t=p("div"),u&&u.c(),g(t,"class","pagefind-ui__result-thumb svelte-4xnkmf")},m(r,s){T(r,t,s),u&&u.m(t,null)},p(r,s){r[1].meta.image?u?u.p(r,s):(u=Ze(r),u.c(),u.m(t,null)):u&&(u.d(1),u=null)},d(r){r&&v(t),u&&u.d()}}}function Ze(e){let t,u,r;return{c(){t=p("img"),g(t,"class","pagefind-ui__result-image svelte-4xnkmf"),ce(t.src,u=e[1].meta?.image)||g(t,"src",u),g(t,"alt",r=e[1].meta?.image_alt||e[1].meta?.title)},m(s,l){T(s,t,l)},p(s,l){l&2&&!ce(t.src,u=s[1].meta?.image)&&g(t,"src",u),l&2&&r!==(r=s[1].meta?.image_alt||s[1].meta?.title)&&g(t,"alt",r)},d(s){s&&v(t)}}}function Ye(e){let t,u=e[1].excerpt+"";return{c(){t=p("p"),g(t,"class","pagefind-ui__result-excerpt svelte-4xnkmf")},m(r,s){T(r,t,s),t.innerHTML=u},p(r,s){s&2&&u!==(u=r[1].excerpt+"")&&(t.innerHTML=u)},d(r){r&&v(t)}}}function Xe(e){let t,u,r,s=e[15].title+"",l,a,n,i,d=e[15].excerpt+"";return{c(){t=p("div"),u=p("p"),r=p("a"),l=S(s),n=M(),i=p("p"),g(r,"class","pagefind-ui__result-link svelte-4xnkmf"),g(r,"href",a=e[15].url),g(u,"class","pagefind-ui__result-title svelte-4xnkmf"),g(i,"class","pagefind-ui__result-excerpt svelte-4xnkmf"),g(t,"class","pagefind-ui__result-nested svelte-4xnkmf")},m(_,h){T(_,t,h),A(t,u),A(u,r),A(r,l),A(t,n),A(t,i),i.innerHTML=d},p(_,h){h&8&&s!==(s=_[15].title+"")&&j(l,s),h&8&&a!==(a=_[15].url)&&g(r,"href",a),h&8&&d!==(d=_[15].excerpt+"")&&(i.innerHTML=d)},d(_){_&&v(t)}}}function Qe(e){let t,u=e[2],r=[];for(let s=0;s<u.length;s+=1)r[s]=$e(Ke(e,u,s));return{c(){t=p("ul");for(let s=0;s<r.length;s+=1)r[s].c();g(t,"class","pagefind-ui__result-tags svelte-4xnkmf")},m(s,l){T(s,t,l);for(let a=0;a<r.length;a+=1)r[a]&&r[a].m(t,null)},p(s,l){if(l&4){u=s[2];let a;for(a=0;a<u.length;a+=1){const n=Ke(s,u,a);r[a]?r[a].p(n,l):(r[a]=$e(n),r[a].c(),r[a].m(t,null))}for(;a<r.length;a+=1)r[a].d(1);r.length=u.length}},d(s){s&&v(t),ie(r,s)}}}function $e(e){let t,u=e[11].replace(/^(\w)/,eu)+"",r,s,l=e[12]+"",a,n;return{c(){t=p("li"),r=S(u),s=S(": "),a=S(l),n=M(),g(t,"class","pagefind-ui__result-tag svelte-4xnkmf")},m(i,d){T(i,t,d),A(t,r),A(t,s),A(t,a),A(t,n)},p(i,d){d&4&&u!==(u=i[11].replace(/^(\w)/,eu)+"")&&j(r,u),d&4&&l!==(l=i[12]+"")&&j(a,l)},d(i){i&&v(t)}}}function Bl(e){let t;function u(l,a){return l[1]?Rl:gl}let r=u(e),s=r(e);return{c(){t=p("li"),s.c(),g(t,"class","pagefind-ui__result svelte-4xnkmf")},m(l,a){T(l,t,a),s.m(t,null)},p(l,[a]){r===(r=u(l))&&s?s.p(l,a):(s.d(1),s=r(l),s&&(s.c(),s.m(t,null)))},i:P,o:P,d(l){l&&v(t),s.d()}}}var eu=e=>e.toLocaleUpperCase();function Al(e,t,u){let{show_images:r=!0}=t,{process_result:s=null}=t,{result:l={data:async()=>{}}}=t;const a=["title","image","image_alt","url"];let n,i=[],d=[],_=!1;const h=(c,o)=>{if(c.length<=o)return c;const E=[...c].sort((B,R)=>R.locations.length-B.locations.length).slice(0,3).map(B=>B.url);return c.filter(B=>E.includes(B.url))},m=async c=>{u(1,n=await c.data()),u(1,n=s?.(n)??n),u(2,i=Object.entries(n.meta).filter(([o])=>!a.includes(o))),Array.isArray(n.sub_results)&&(u(4,_=n.sub_results?.[0]?.url===(n.meta?.url||n.url)),_?u(3,d=h(n.sub_results.slice(1),3)):u(3,d=h([...n.sub_results],3)))},f=(c=30)=>". ".repeat(Math.floor(10+Math.random()*c));return e.$$set=c=>{"show_images"in c&&u(0,r=c.show_images),"process_result"in c&&u(6,s=c.process_result),"result"in c&&u(7,l=c.result)},e.$$.update=()=>{e.$$.dirty&128&&m(l)},[r,n,i,d,_,f,s,l]}var pl=class extends me{constructor(e){super(),he(this,e,Al,Bl,fe,{show_images:0,process_result:6,result:7})}},vl=pl;function uu(e,t,u){const r=e.slice();return r[10]=t[u][0],r[11]=t[u][1],r[12]=t,r[13]=u,r}function tu(e,t,u){const r=e.slice();return r[14]=t[u][0],r[15]=t[u][1],r[16]=t,r[17]=u,r}function ru(e){let t,u,r=e[4]("filters_label",e[5],e[6])+"",s,l,a=Object.entries(e[1]),n=[];for(let i=0;i<a.length;i+=1)n[i]=au(uu(e,a,i));return{c(){t=p("fieldset"),u=p("legend"),s=S(r),l=M();for(let i=0;i<n.length;i+=1)n[i].c();g(u,"class","pagefind-ui__filter-panel-label svelte-1v2r7ls"),g(t,"class","pagefind-ui__filter-panel svelte-1v2r7ls")},m(i,d){T(i,t,d),A(t,u),A(u,s),A(t,l);for(let _=0;_<n.length;_+=1)n[_]&&n[_].m(t,null)},p(i,d){if(d&112&&r!==(r=i[4]("filters_label",i[5],i[6])+"")&&j(s,r),d&143){a=Object.entries(i[1]);let _;for(_=0;_<a.length;_+=1){const h=uu(i,a,_);n[_]?n[_].p(h,d):(n[_]=au(h),n[_].c(),n[_].m(t,null))}for(;_<n.length;_+=1)n[_].d(1);n.length=a.length}},d(i){i&&v(t),ie(n,i)}}}function su(e){let t,u,r,s,l,a,n,i,d=e[14]+"",_,h=e[15]+"",m,f,c,o,E,B;function R(){e[9].call(u,e[10],e[14])}return{c(){t=p("div"),u=p("input"),a=M(),n=p("label"),i=new Qs(!1),_=S(" ("),m=S(h),f=S(")"),o=M(),g(u,"class","pagefind-ui__filter-checkbox svelte-1v2r7ls"),g(u,"type","checkbox"),g(u,"id",r=e[10]+"-"+e[14]),g(u,"name",s=e[10]),u.__value=l=e[14],u.value=u.__value,i.a=_,g(n,"class","pagefind-ui__filter-label svelte-1v2r7ls"),g(n,"for",c=e[10]+"-"+e[14]),g(t,"class","pagefind-ui__filter-value svelte-1v2r7ls"),K(t,"pagefind-ui__filter-value--checked",e[0][`${e[10]}:${e[14]}`])},m(F,N){T(F,t,N),A(t,u),u.checked=e[0][`${e[10]}:${e[14]}`],A(t,a),A(t,n),i.m(d,n),A(n,_),A(n,m),A(n,f),A(t,o),E||(B=G(u,"change",R),E=!0)},p(F,N){e=F,N&2&&r!==(r=e[10]+"-"+e[14])&&g(u,"id",r),N&2&&s!==(s=e[10])&&g(u,"name",s),N&2&&l!==(l=e[14])&&(u.__value=l,u.value=u.__value),N&3&&(u.checked=e[0][`${e[10]}:${e[14]}`]),N&2&&d!==(d=e[14]+"")&&i.p(d),N&2&&h!==(h=e[15]+"")&&j(m,h),N&2&&c!==(c=e[10]+"-"+e[14])&&g(n,"for",c),N&3&&K(t,"pagefind-ui__filter-value--checked",e[0][`${e[10]}:${e[14]}`])},d(F){F&&v(t),E=!1,B()}}}function lu(e){let t,u=(e[2]||e[15]||e[0][`${e[10]}:${e[14]}`])&&su(e);return{c(){u&&u.c(),t=ee()},m(r,s){u&&u.m(r,s),T(r,t,s)},p(r,s){r[2]||r[15]||r[0][`${r[10]}:${r[14]}`]?u?u.p(r,s):(u=su(r),u.c(),u.m(t.parentNode,t)):u&&(u.d(1),u=null)},d(r){u&&u.d(r),r&&v(t)}}}function au(e){let t,u,r=e[10].replace(/^(\w)/,nu)+"",s,l,a,n=e[10]+"",i,d,_,h=Object.entries(e[11]||{}),m=[];for(let f=0;f<h.length;f+=1)m[f]=lu(tu(e,h,f));return{c(){t=p("details"),u=p("summary"),s=M(),l=p("fieldset"),a=p("legend"),i=M();for(let f=0;f<m.length;f+=1)m[f].c();d=M(),g(u,"class","pagefind-ui__filter-name svelte-1v2r7ls"),g(a,"class","pagefind-ui__filter-group-label svelte-1v2r7ls"),g(l,"class","pagefind-ui__filter-group svelte-1v2r7ls"),g(t,"class","pagefind-ui__filter-block svelte-1v2r7ls"),t.open=_=e[7]||e[3].map(iu).includes(e[10].toLowerCase())},m(f,c){T(f,t,c),A(t,u),u.innerHTML=r,A(t,s),A(t,l),A(l,a),a.innerHTML=n,A(l,i);for(let o=0;o<m.length;o+=1)m[o]&&m[o].m(l,null);A(t,d)},p(f,c){if(c&2&&r!==(r=f[10].replace(/^(\w)/,nu)+"")&&(u.innerHTML=r),c&2&&n!==(n=f[10]+"")&&(a.innerHTML=n),c&7){h=Object.entries(f[11]||{});let o;for(o=0;o<h.length;o+=1){const E=tu(f,h,o);m[o]?m[o].p(E,c):(m[o]=lu(E),m[o].c(),m[o].m(l,null))}for(;o<m.length;o+=1)m[o].d(1);m.length=h.length}c&138&&_!==(_=f[7]||f[3].map(iu).includes(f[10].toLowerCase()))&&(t.open=_)},d(f){f&&v(t),ie(m,f)}}}function Tl(e){let t=e[1]&&Object.entries(e[1]).length,u,r=t&&ru(e);return{c(){r&&r.c(),u=ee()},m(s,l){r&&r.m(s,l),T(s,u,l)},p(s,[l]){l&2&&(t=s[1]&&Object.entries(s[1]).length),t?r?r.p(s,l):(r=ru(s),r.c(),r.m(u.parentNode,u)):r&&(r.d(1),r=null)},i:P,o:P,d(s){r&&r.d(s),s&&v(u)}}}var nu=e=>e.toLocaleUpperCase(),iu=e=>e.toLowerCase();function kl(e,t,u){let{available_filters:r=null}=t,{show_empty_filters:s=!0}=t,{open_filters:l=[]}=t,{translate:a=()=>""}=t,{automatic_translations:n={}}=t,{translations:i={}}=t,{selected_filters:d={}}=t,_=!1,h=!1;function m(f,c){d[`${f}:${c}`]=this.checked,u(0,d)}return e.$$set=f=>{"available_filters"in f&&u(1,r=f.available_filters),"show_empty_filters"in f&&u(2,s=f.show_empty_filters),"open_filters"in f&&u(3,l=f.open_filters),"translate"in f&&u(4,a=f.translate),"automatic_translations"in f&&u(5,n=f.automatic_translations),"translations"in f&&u(6,i=f.translations),"selected_filters"in f&&u(0,d=f.selected_filters)},e.$$.update=()=>{if(e.$$.dirty&258&&r&&!_){u(8,_=!0);let f=Object.entries(r||{});f.length===1&&Object.entries(f[0][1])?.length<=6&&u(7,h=!0)}},[d,r,s,l,a,n,i,h,_,m]}var Fl=class extends me{constructor(e){super(),he(this,e,kl,Tl,fe,{available_filters:1,show_empty_filters:2,open_filters:3,translate:4,automatic_translations:5,translations:6,selected_filters:0})}},bl=Fl,Bu={};k(Bu,{comments:()=>pu,default:()=>Ml,direction:()=>vu,strings:()=>Tu,thanks_to:()=>Au});var Au="Jan Claasen <jan@cloudcannon.com>",pu="",vu="ltr",Tu={placeholder:"Soek",clear_search:"Opruim",load_more:"Laai nog resultate",search_label:"Soek hierdie webwerf",filters_label:"Filters",zero_results:"Geen resultate vir [SEARCH_TERM]",many_results:"[COUNT] resultate vir [SEARCH_TERM]",one_result:"[COUNT] resultate vir [SEARCH_TERM]",alt_search:"Geen resultate vir [SEARCH_TERM]. Toon resultate vir [DIFFERENT_TERM] in plaas daarvan",search_suggestion:"Geen resultate vir [SEARCH_TERM]. Probeer eerder een van die volgende terme:",searching:"Soek vir [SEARCH_TERM]"},Ml={thanks_to:Au,comments:pu,direction:vu,strings:Tu},ku={};k(ku,{comments:()=>bu,default:()=>Sl,direction:()=>Mu,strings:()=>Su,thanks_to:()=>Fu});var Fu="Maruf Alom <mail@marufalom.com>",bu="",Mu="ltr",Su={placeholder:"অনুসন্ধান করুন",clear_search:"মুছে ফেলুন",load_more:"আরো ফলাফল দেখুন",search_label:"এই ওয়েবসাইটে অনুসন্ধান করুন",filters_label:"ফিল্টার",zero_results:"[SEARCH_TERM] এর জন্য কিছু খুঁজে পাওয়া যায়নি",many_results:"[COUNT]-টি ফলাফল পাওয়া গিয়েছে [SEARCH_TERM] এর জন্য",one_result:"[COUNT]-টি ফলাফল পাওয়া গিয়েছে [SEARCH_TERM] এর জন্য",alt_search:"কোন কিছু খুঁজে পাওয়া যায়নি [SEARCH_TERM] এর জন্য. পরিবর্তে [DIFFERENT_TERM] এর জন্য দেখানো হচ্ছে",search_suggestion:"কোন কিছু খুঁজে পাওয়া যায়নি [SEARCH_TERM] এর বিষয়ে. নিন্মের বিষয়বস্তু খুঁজে দেখুন:",searching:"অনুসন্ধান চলছে [SEARCH_TERM]..."},Sl={thanks_to:Fu,comments:bu,direction:Mu,strings:Su},Du={};k(Du,{comments:()=>wu,default:()=>Dl,direction:()=>yu,strings:()=>Nu,thanks_to:()=>Hu});var Hu="Pablo Villaverde <https://github.com/pvillaverde>",wu="",yu="ltr",Nu={placeholder:"Cerca",clear_search:"Netejar",load_more:"Veure mées resultats",search_label:"Cerca en aquest lloc",filters_label:"Filtres",zero_results:"No es van trobar resultats per [SEARCH_TERM]",many_results:"[COUNT] resultats trobats per [SEARCH_TERM]",one_result:"[COUNT] resultat trobat per [SEARCH_TERM]",alt_search:"No es van trobar resultats per [SEARCH_TERM]. Mostrant al seu lloc resultats per [DIFFERENT_TERM]",search_suggestion:"No es van trobar resultats per [SEARCH_TERM]. Proveu una de les cerques següents:",searching:"Cercant [SEARCH_TERM]..."},Dl={thanks_to:Hu,comments:wu,direction:yu,strings:Nu},zu={};k(zu,{comments:()=>Ou,default:()=>Hl,direction:()=>Uu,strings:()=>Iu,thanks_to:()=>ju});var ju="Dalibor Hon <https://github.com/dallyh>",Ou="",Uu="ltr",Iu={placeholder:"Hledat",clear_search:"Smazat",load_more:"Načíst další výsledky",search_label:"Prohledat tuto stránku",filters_label:"Filtry",zero_results:"Žádné výsledky pro [SEARCH_TERM]",many_results:"[COUNT] výsledků pro [SEARCH_TERM]",one_result:"[COUNT] výsledek pro [SEARCH_TERM]",alt_search:"Žádné výsledky pro [SEARCH_TERM]. Zobrazují se výsledky pro [DIFFERENT_TERM]",search_suggestion:"Žádné výsledky pro [SEARCH_TERM]. Související výsledky hledání:",searching:"Hledám [SEARCH_TERM]..."},Hl={thanks_to:ju,comments:Ou,direction:Uu,strings:Iu},Pu={};k(Pu,{comments:()=>xu,default:()=>wl,direction:()=>qu,strings:()=>Vu,thanks_to:()=>Lu});var Lu="Jonas Smedegaard <dr@jones.dk>",xu="",qu="ltr",Vu={placeholder:"Søg",clear_search:"Nulstil",load_more:"Indlæs flere resultater",search_label:"Søg på dette website",filters_label:"Filtre",zero_results:"Ingen resultater for [SEARCH_TERM]",many_results:"[COUNT] resultater for [SEARCH_TERM]",one_result:"[COUNT] resultat for [SEARCH_TERM]",alt_search:"Ingen resultater for [SEARCH_TERM]. Viser resultater for [DIFFERENT_TERM] i stedet",search_suggestion:"Ingen resultater for [SEARCH_TERM]. Prøv et af disse søgeord i stedet:",searching:"Søger efter [SEARCH_TERM]..."},wl={thanks_to:Lu,comments:xu,direction:qu,strings:Vu},Ku={};k(Ku,{comments:()=>Ju,default:()=>yl,direction:()=>Wu,strings:()=>Zu,thanks_to:()=>Gu});var Gu="Jan Claasen <jan@cloudcannon.com>",Ju="",Wu="ltr",Zu={placeholder:"Suche",clear_search:"Löschen",load_more:"Mehr Ergebnisse laden",search_label:"Suche diese Seite",filters_label:"Filter",zero_results:"Keine Ergebnisse für [SEARCH_TERM]",many_results:"[COUNT] Ergebnisse für [SEARCH_TERM]",one_result:"[COUNT] Ergebnis für [SEARCH_TERM]",alt_search:"Keine Ergebnisse für [SEARCH_TERM]. Stattdessen werden Ergebnisse für [DIFFERENT_TERM] angezeigt",search_suggestion:"Keine Ergebnisse für [SEARCH_TERM]. Versuchen Sie eine der folgenden Suchen:",searching:"Suche für [SEARCH_TERM]"},yl={thanks_to:Gu,comments:Ju,direction:Wu,strings:Zu},Yu={};k(Yu,{comments:()=>Qu,default:()=>Nl,direction:()=>$u,strings:()=>et,thanks_to:()=>Xu});var Xu="Liam Bigelow <liam@cloudcannon.com>",Qu="",$u="ltr",et={placeholder:"Search",clear_search:"Clear",load_more:"Load more results",search_label:"Search this site",filters_label:"Filters",zero_results:"No results for [SEARCH_TERM]",many_results:"[COUNT] results for [SEARCH_TERM]",one_result:"[COUNT] result for [SEARCH_TERM]",alt_search:"No results for [SEARCH_TERM]. Showing results for [DIFFERENT_TERM] instead",search_suggestion:"No results for [SEARCH_TERM]. Try one of the following searches:",searching:"Searching for [SEARCH_TERM]..."},Nl={thanks_to:Xu,comments:Qu,direction:$u,strings:et},ut={};k(ut,{comments:()=>rt,default:()=>zl,direction:()=>st,strings:()=>lt,thanks_to:()=>tt});var tt="Pablo Villaverde <https://github.com/pvillaverde>",rt="",st="ltr",lt={placeholder:"Buscar",clear_search:"Limpiar",load_more:"Ver más resultados",search_label:"Buscar en este sitio",filters_label:"Filtros",zero_results:"No se encontraron resultados para [SEARCH_TERM]",many_results:"[COUNT] resultados encontrados para [SEARCH_TERM]",one_result:"[COUNT] resultado encontrado para [SEARCH_TERM]",alt_search:"No se encontraron resultados para [SEARCH_TERM]. Mostrando en su lugar resultados para [DIFFERENT_TERM]",search_suggestion:"No se encontraron resultados para [SEARCH_TERM]. Prueba una de las siguientes búsquedas:",searching:"Buscando [SEARCH_TERM]..."},zl={thanks_to:tt,comments:rt,direction:st,strings:lt},at={};k(at,{comments:()=>it,default:()=>jl,direction:()=>ot,strings:()=>_t,thanks_to:()=>nt});var nt="Valtteri Laitinen <dev@valtlai.fi>",it="",ot="ltr",_t={placeholder:"Haku",clear_search:"Tyhjennä",load_more:"Lataa lisää tuloksia",search_label:"Hae tältä sivustolta",filters_label:"Suodattimet",zero_results:"Ei tuloksia haulle [SEARCH_TERM]",many_results:"[COUNT] tulosta haulle [SEARCH_TERM]",one_result:"[COUNT] tulos haulle [SEARCH_TERM]",alt_search:"Ei tuloksia haulle [SEARCH_TERM]. Näytetään tulokset sen sijaan haulle [DIFFERENT_TERM]",search_suggestion:"Ei tuloksia haulle [SEARCH_TERM]. Kokeile jotain seuraavista:",searching:"Haetaan [SEARCH_TERM]..."},jl={thanks_to:nt,comments:it,direction:ot,strings:_t},ct={};k(ct,{comments:()=>Et,default:()=>Ol,direction:()=>dt,strings:()=>ht,thanks_to:()=>ft});var ft="Nicolas Friedli <nicolas@theologique.ch>",Et="",dt="ltr",ht={placeholder:"Rechercher",clear_search:"Nettoyer",load_more:"Charger plus de résultats",search_label:"Recherche sur ce site",filters_label:"Filtres",zero_results:"Pas de résultat pour [SEARCH_TERM]",many_results:"[COUNT] résultats pour [SEARCH_TERM]",one_result:"[COUNT] résultat pour [SEARCH_TERM]",alt_search:"Pas de résultat pour [SEARCH_TERM]. Montre les résultats pour [DIFFERENT_TERM] à la place",search_suggestion:"Pas de résultat pour [SEARCH_TERM]. Essayer une des recherches suivantes:",searching:"Recherche [SEARCH_TERM]..."},Ol={thanks_to:ft,comments:Et,direction:dt,strings:ht},mt={};k(mt,{comments:()=>gt,default:()=>Ul,direction:()=>Rt,strings:()=>Bt,thanks_to:()=>Ct});var Ct="Pablo Villaverde <https://github.com/pvillaverde>",gt="",Rt="ltr",Bt={placeholder:"Buscar",clear_search:"Limpar",load_more:"Ver máis resultados",search_label:"Buscar neste sitio",filters_label:"Filtros",zero_results:"Non se atoparon resultados para [SEARCH_TERM]",many_results:"[COUNT] resultados atopados para [SEARCH_TERM]",one_result:"[COUNT] resultado atopado para [SEARCH_TERM]",alt_search:"Non se atoparon resultados para [SEARCH_TERM]. Amosando no seu lugar resultados para [DIFFERENT_TERM]",search_suggestion:"Non se atoparon resultados para [SEARCH_TERM]. Probe unha das seguintes pesquisas:",searching:"Buscando [SEARCH_TERM]..."},Ul={thanks_to:Ct,comments:gt,direction:Rt,strings:Bt},At={};k(At,{comments:()=>vt,default:()=>Il,direction:()=>Tt,strings:()=>kt,thanks_to:()=>pt});var pt="Amit Yadav <amit@thetechbasket.com>",vt="",Tt="ltr",kt={placeholder:"खोजें",clear_search:"साफ करें",load_more:"और अधिक परिणाम लोड करें",search_label:"इस साइट में खोजें",filters_label:"फ़िल्टर",zero_results:"कोई परिणाम [SEARCH_TERM] के लिए नहीं मिला",many_results:"[COUNT] परिणाम [SEARCH_TERM] के लिए मिले",one_result:"[COUNT] परिणाम [SEARCH_TERM] के लिए मिला",alt_search:"[SEARCH_TERM] के लिए कोई परिणाम नहीं मिला। इसके बजाय [DIFFERENT_TERM] के लिए परिणाम दिखा रहा है",search_suggestion:"[SEARCH_TERM] के लिए कोई परिणाम नहीं मिला। निम्नलिखित खोजों में से कोई एक आज़माएं:",searching:"[SEARCH_TERM] की खोज की जा रही है..."},Il={thanks_to:pt,comments:vt,direction:Tt,strings:kt},Ft={};k(Ft,{comments:()=>Mt,default:()=>Pl,direction:()=>St,strings:()=>Dt,thanks_to:()=>bt});var bt="Diomed <https://github.com/diomed>",Mt="",St="ltr",Dt={placeholder:"Traži",clear_search:"Očisti",load_more:"Učitaj više rezultata",search_label:"Pretraži ovu stranicu",filters_label:"Filteri",zero_results:"Nema rezultata za [SEARCH_TERM]",many_results:"[COUNT] rezultata za [SEARCH_TERM]",one_result:"[COUNT] rezultat za [SEARCH_TERM]",alt_search:"Nema rezultata za [SEARCH_TERM]. Prikazujem rezultate za [DIFFERENT_TERM]",search_suggestion:"Nema rezultata za [SEARCH_TERM]. Pokušaj s jednom od ovih pretraga:",searching:"Pretražujem [SEARCH_TERM]..."},Pl={thanks_to:bt,comments:Mt,direction:St,strings:Dt},Ht={};k(Ht,{comments:()=>yt,default:()=>Ll,direction:()=>Nt,strings:()=>zt,thanks_to:()=>wt});var wt="Adam Laki <info@adamlaki.com>",yt="",Nt="ltr",zt={placeholder:"Keresés",clear_search:"Törlés",load_more:"További találatok betöltése",search_label:"Keresés az oldalon",filters_label:"Szűrés",zero_results:"Nincs találat a(z) [SEARCH_TERM] kifejezésre",many_results:"[COUNT] db találat a(z) [SEARCH_TERM] kifejezésre",one_result:"[COUNT] db találat a(z) [SEARCH_TERM] kifejezésre",alt_search:"Nincs találat a(z) [SEARCH_TERM] kifejezésre. Találatok mutatása inkább a(z) [DIFFERENT_TERM] kifejezésre",search_suggestion:"Nincs találat a(z) [SEARCH_TERM] kifejezésre. Próbáld meg a következő keresések egyikét:",searching:"Keresés a(z) [SEARCH_TERM] kifejezésre..."},Ll={thanks_to:wt,comments:yt,direction:Nt,strings:zt},jt={};k(jt,{comments:()=>Ut,default:()=>xl,direction:()=>It,strings:()=>Pt,thanks_to:()=>Ot});var Ot="Nixentric",Ut="",It="ltr",Pt={placeholder:"Cari",clear_search:"Bersihkan",load_more:"Muat lebih banyak hasil",search_label:"Telusuri situs ini",filters_label:"Filter",zero_results:"[SEARCH_TERM] tidak ditemukan",many_results:"Ditemukan [COUNT] hasil untuk [SEARCH_TERM]",one_result:"Ditemukan [COUNT] hasil untuk [SEARCH_TERM]",alt_search:"[SEARCH_TERM] tidak ditemukan. Menampilkan hasil [DIFFERENT_TERM] sebagai gantinya",search_suggestion:"[SEARCH_TERM] tidak ditemukan. Coba salah satu pencarian berikut ini:",searching:"Mencari [SEARCH_TERM]..."},xl={thanks_to:Ot,comments:Ut,direction:It,strings:Pt},Lt={};k(Lt,{comments:()=>qt,default:()=>ql,direction:()=>Vt,strings:()=>Kt,thanks_to:()=>xt});var xt="Cosette Bruhns Alonso, Andrew Janco <apjanco@upenn.edu>",qt="",Vt="ltr",Kt={placeholder:"Cerca",clear_search:"Cancella la cronologia",load_more:"Mostra più risultati",search_label:"Cerca nel sito",filters_label:"Filtri di ricerca",zero_results:"Nessun risultato per [SEARCH_TERM]",many_results:"[COUNT] risultati per [SEARCH_TERM]",one_result:"[COUNT] risultato per [SEARCH_TERM]",alt_search:"Nessun risultato per [SEARCH_TERM]. Mostrando risultati per [DIFFERENT_TERM] come alternativa.",search_suggestion:"Nessun risultato per [SEARCH_TERM]. Prova una delle seguenti ricerche:",searching:"Cercando [SEARCH_TERM]..."},ql={thanks_to:xt,comments:qt,direction:Vt,strings:Kt},Gt={};k(Gt,{comments:()=>Wt,default:()=>Vl,direction:()=>Zt,strings:()=>Yt,thanks_to:()=>Jt});var Jt="Tate",Wt="",Zt="ltr",Yt={placeholder:"検索",clear_search:"クリア",load_more:"次を読み込む",search_label:"このサイトを検索",filters_label:"フィルタ",zero_results:"[SEARCH_TERM]の検索に一致する情報はありませんでした",many_results:"[SEARCH_TERM]の[COUNT]件の検索結果",one_result:"[SEARCH_TERM]の[COUNT]件の検索結果",alt_search:"[SEARCH_TERM]の検索に一致する情報はありませんでした。[DIFFERENT_TERM]の検索結果を表示しています",search_suggestion:"[SEARCH_TERM]の検索に一致する情報はありませんでした。次のいずれかの検索を試してください",searching:"[SEARCH_TERM]を検索しています"},Vl={thanks_to:Jt,comments:Wt,direction:Zt,strings:Yt},Xt={};k(Xt,{comments:()=>$t,default:()=>Kl,direction:()=>er,strings:()=>ur,thanks_to:()=>Qt});var Qt="Seokho Son <https://github.com/seokho-son>",$t="",er="ltr",ur={placeholder:"검색어",clear_search:"비우기",load_more:"검색 결과 더 보기",search_label:"사이트 검색",filters_label:"필터",zero_results:"[SEARCH_TERM]에 대한 결과 없음",many_results:"[SEARCH_TERM]에 대한 결과 [COUNT]건",one_result:"[SEARCH_TERM]에 대한 결과 [COUNT]건",alt_search:"[SEARCH_TERM]에 대한 결과 없음. [DIFFERENT_TERM]에 대한 결과",search_suggestion:"[SEARCH_TERM]에 대한 결과 없음. 추천 검색어: ",searching:"[SEARCH_TERM] 검색 중..."},Kl={thanks_to:Qt,comments:$t,direction:er,strings:ur},tr={};k(tr,{comments:()=>sr,default:()=>Gl,direction:()=>lr,strings:()=>ar,thanks_to:()=>rr});var rr="",sr="",lr="ltr",ar={placeholder:"Rapu",clear_search:"Whakakore",load_more:"Whakauta ētahi otinga kē",search_label:"Rapu",filters_label:"Tātari",zero_results:"Otinga kore ki [SEARCH_TERM]",many_results:"[COUNT] otinga ki [SEARCH_TERM]",one_result:"[COUNT] otinga ki [SEARCH_TERM]",alt_search:"Otinga kore ki [SEARCH_TERM]. Otinga kē ki [DIFFERENT_TERM]",search_suggestion:"Otinga kore ki [SEARCH_TERM]. whakamātau ki ngā mea atu:",searching:"Rapu ki [SEARCH_TERM]..."},Gl={thanks_to:rr,comments:sr,direction:lr,strings:ar},nr={};k(nr,{comments:()=>or,default:()=>Jl,direction:()=>_r,strings:()=>cr,thanks_to:()=>ir});var ir="Paul van Brouwershaven",or="",_r="ltr",cr={placeholder:"Zoeken",clear_search:"Reset",load_more:"Meer resultaten laden",search_label:"Doorzoek deze site",filters_label:"Filters",zero_results:"Geen resultaten voor [SEARCH_TERM]",many_results:"[COUNT] resultaten voor [SEARCH_TERM]",one_result:"[COUNT] resultaat voor [SEARCH_TERM]",alt_search:"Geen resultaten voor [SEARCH_TERM]. In plaats daarvan worden resultaten voor [DIFFERENT_TERM] weergegeven",search_suggestion:"Geen resultaten voor [SEARCH_TERM]. Probeer een van de volgende zoekopdrachten:",searching:"Zoeken naar [SEARCH_TERM]..."},Jl={thanks_to:ir,comments:or,direction:_r,strings:cr},fr={};k(fr,{comments:()=>dr,default:()=>Wl,direction:()=>hr,strings:()=>mr,thanks_to:()=>Er});var Er="Christopher Wingate",dr="",hr="ltr",mr={placeholder:"Søk",clear_search:"Fjern",load_more:"Last flere resultater",search_label:"Søk på denne siden",filters_label:"Filtre",zero_results:"Ingen resultater for [SEARCH_TERM]",many_results:"[COUNT] resultater for [SEARCH_TERM]",one_result:"[COUNT] resultat for [SEARCH_TERM]",alt_search:"Ingen resultater for [SEARCH_TERM]. Viser resultater for [DIFFERENT_TERM] i stedet",search_suggestion:"Ingen resultater for [SEARCH_TERM]. Prøv en av disse søkeordene i stedet:",searching:"Søker etter [SEARCH_TERM]"},Wl={thanks_to:Er,comments:dr,direction:hr,strings:mr},Cr={};k(Cr,{comments:()=>Rr,default:()=>Zl,direction:()=>Br,strings:()=>Ar,thanks_to:()=>gr});var gr="",Rr="",Br="ltr",Ar={placeholder:"Szukaj",clear_search:"Wyczyść",load_more:"Załaduj więcej",search_label:"Przeszukaj tę stronę",filters_label:"Filtry",zero_results:"Brak wyników dla [SEARCH_TERM]",many_results:"[COUNT] wyników dla [SEARCH_TERM]",one_result:"[COUNT] wynik dla [SEARCH_TERM]",alt_search:"Brak wyników dla [SEARCH_TERM]. Wyświetlam wyniki dla [DIFFERENT_TERM]",search_suggestion:"Brak wyników dla [SEARCH_TERM]. Pokrewne wyniki wyszukiwania:",searching:"Szukam [SEARCH_TERM]..."},Zl={thanks_to:gr,comments:Rr,direction:Br,strings:Ar},pr={};k(pr,{comments:()=>Tr,default:()=>Yl,direction:()=>kr,strings:()=>Fr,thanks_to:()=>vr});var vr="Jonatah",Tr="",kr="ltr",Fr={placeholder:"Pesquisar",clear_search:"Limpar",load_more:"Ver mais resultados",search_label:"Pesquisar",filters_label:"Filtros",zero_results:"Nenhum resultado encontrado para [SEARCH_TERM]",many_results:"[COUNT] resultados encontrados para [SEARCH_TERM]",one_result:"[COUNT] resultado encontrado para [SEARCH_TERM]",alt_search:"Nenhum resultado encontrado para [SEARCH_TERM]. Exibindo resultados para [DIFFERENT_TERM]",search_suggestion:"Nenhum resultado encontrado para [SEARCH_TERM]. Tente uma das seguintes pesquisas:",searching:"Pesquisando por [SEARCH_TERM]..."},Yl={thanks_to:vr,comments:Tr,direction:kr,strings:Fr},br={};k(br,{comments:()=>Sr,default:()=>Xl,direction:()=>Dr,strings:()=>Hr,thanks_to:()=>Mr});var Mr="Bogdan Mateescu <bogdan@surfverse.com>",Sr="",Dr="ltr",Hr={placeholder:"Căutare",clear_search:"Ştergeţi",load_more:"Încărcați mai multe rezultate",search_label:"Căutați în acest site",filters_label:"Filtre",zero_results:"Niciun rezultat pentru [SEARCH_TERM]",many_results:"[COUNT] rezultate pentru [SEARCH_TERM]",one_result:"[COUNT] rezultat pentru [SEARCH_TERM]",alt_search:"Niciun rezultat pentru [SEARCH_TERM]. Se afișează în schimb rezultatele pentru [DIFFERENT_TERM]",search_suggestion:"Niciun rezultat pentru [SEARCH_TERM]. Încercați una dintre următoarele căutări:",searching:"Se caută după: [SEARCH_TERM]..."},Xl={thanks_to:Mr,comments:Sr,direction:Dr,strings:Hr},wr={};k(wr,{comments:()=>Nr,default:()=>Ql,direction:()=>zr,strings:()=>jr,thanks_to:()=>yr});var yr="Aleksandr Gordeev",Nr="",zr="ltr",jr={placeholder:"Поиск",clear_search:"Очистить поле",load_more:"Загрузить еще",search_label:"Поиск по сайту",filters_label:"Фильтры",zero_results:"Ничего не найдено по запросу: [SEARCH_TERM]",many_results:"[COUNT] результатов по запросу: [SEARCH_TERM]",one_result:"[COUNT] результат по запросу: [SEARCH_TERM]",alt_search:"Ничего не найдено по запросу: [SEARCH_TERM]. Показаны результаты по запросу: [DIFFERENT_TERM]",search_suggestion:"Ничего не найдено по запросу: [SEARCH_TERM]. Попробуйте один из следующих вариантов",searching:"Поиск по запросу: [SEARCH_TERM]"},Ql={thanks_to:yr,comments:Nr,direction:zr,strings:jr},Or={};k(Or,{comments:()=>Ir,default:()=>$l,direction:()=>Pr,strings:()=>Lr,thanks_to:()=>Ur});var Ur="Andrija Sagicc",Ir="",Pr="ltr",Lr={placeholder:"Претрага",clear_search:"Брисање",load_more:"Приказ више резултата",search_label:"Претрага сајта",filters_label:"Филтери",zero_results:"Нема резултата за [SEARCH_TERM]",many_results:"[COUNT] резултата за [SEARCH_TERM]",one_result:"[COUNT] резултата за [SEARCH_TERM]",alt_search:"Нема резултата за [SEARCH_TERM]. Приказ додатник резултата за [DIFFERENT_TERM]",search_suggestion:"Нема резултата за [SEARCH_TERM]. Покушајте са неком од следећих претрага:",searching:"Претрага термина [SEARCH_TERM]..."},$l={thanks_to:Ur,comments:Ir,direction:Pr,strings:Lr},xr={};k(xr,{comments:()=>Vr,default:()=>ea,direction:()=>Kr,strings:()=>Gr,thanks_to:()=>qr});var qr="Montazar Al-Jaber <montazar@nanawee.tech>",Vr="",Kr="ltr",Gr={placeholder:"Sök",clear_search:"Rensa",load_more:"Visa fler träffar",search_label:"Sök på denna sida",filters_label:"Filter",zero_results:"[SEARCH_TERM] gav inga träffar",many_results:"[SEARCH_TERM] gav [COUNT] träffar",one_result:"[SEARCH_TERM] gav [COUNT] träff",alt_search:"[SEARCH_TERM] gav inga träffar. Visar resultat för [DIFFERENT_TERM] istället",search_suggestion:"[SEARCH_TERM] gav inga träffar. Försök igen med en av följande sökord:",searching:"Söker efter [SEARCH_TERM]..."},ea={thanks_to:qr,comments:Vr,direction:Kr,strings:Gr},Jr={};k(Jr,{comments:()=>Zr,default:()=>ua,direction:()=>Yr,strings:()=>Xr,thanks_to:()=>Wr});var Wr="Anonymous",Zr="",Yr="ltr",Xr={placeholder:"Tafuta",clear_search:"Futa",load_more:"Pakia matokeo zaidi",search_label:"Tafuta tovuti hii",filters_label:"Vichujio",zero_results:"Hakuna matokeo ya [SEARCH_TERM]",many_results:"Matokeo [COUNT] ya [SEARCH_TERM]",one_result:"Tokeo [COUNT] la [SEARCH_TERM]",alt_search:"Hakuna mayokeo ya [SEARCH_TERM]. Badala yake, inaonyesha matokeo ya [DIFFERENT_TERM]",search_suggestion:"Hakuna matokeo ya [SEARCH_TERM]. Jaribu mojawapo ya utafutaji ufuatao:",searching:"Kutafuta [SEARCH_TERM]..."},ua={thanks_to:Wr,comments:Zr,direction:Yr,strings:Xr},Qr={};k(Qr,{comments:()=>es,default:()=>ta,direction:()=>us,strings:()=>ts,thanks_to:()=>$r});var $r="",es="",us="ltr",ts={placeholder:"தேடுக",clear_search:"அழிக்குக",load_more:"மேலும் முடிவுகளைக் காட்டுக",search_label:"இந்த தளத்தில் தேடுக",filters_label:"வடிகட்டல்கள்",zero_results:"[SEARCH_TERM] க்கான முடிவுகள் இல்லை",many_results:"[SEARCH_TERM] க்கான [COUNT] முடிவுகள்",one_result:"[SEARCH_TERM] க்கான முடிவு",alt_search:"[SEARCH_TERM] இத்தேடலுக்கான முடிவுகள் இல்லை, இந்த தேடல்களுக்கான ஒத்த முடிவுகள் [DIFFERENT_TERM]",search_suggestion:"[SEARCH_TERM] இத் தேடலுக்கான முடிவுகள் இல்லை.இதற்கு பதிலீடான தேடல்களை தேடுக:",searching:"[SEARCH_TERM] தேடப்படுகின்றது"},ta={thanks_to:$r,comments:es,direction:us,strings:ts},rs={};k(rs,{comments:()=>ls,default:()=>ra,direction:()=>as,strings:()=>ns,thanks_to:()=>ss});var ss="Taylan Özgür Bildik",ls="",as="ltr",ns={placeholder:"Araştır",clear_search:"Temizle",load_more:"Daha fazla sonuç",search_label:"Site genelinde arama",filters_label:"Filtreler",zero_results:"[SEARCH_TERM] için sonuç yok",many_results:"[SEARCH_TERM] için [COUNT] sonuç bulundu",one_result:"[SEARCH_TERM] için [COUNT] sonuç bulundu",alt_search:"[SEARCH_TERM] için sonuç yok. Bunun yerine [DIFFERENT_TERM] için sonuçlar gösteriliyor",search_suggestion:"[SEARCH_TERM] için sonuç yok. Alternatif olarak aşağıdaki kelimelerden birini deneyebilirsiniz:",searching:"[SEARCH_TERM] araştırılıyor..."},ra={thanks_to:ss,comments:ls,direction:as,strings:ns},is={};k(is,{comments:()=>_s,default:()=>sa,direction:()=>cs,strings:()=>fs,thanks_to:()=>os});var os="Vladyslav Lyshenko <vladdnepr1989@gmail.com>",_s="",cs="ltr",fs={placeholder:"Пошук",clear_search:"Очистити поле",load_more:"Завантажити ще",search_label:"Пошук по сайту",filters_label:"Фільтри",zero_results:"Нічого не знайдено за запитом: [SEARCH_TERM]",many_results:"[COUNT] результатів на запит: [SEARCH_TERM]",one_result:"[COUNT] результат за запитом: [SEARCH_TERM]",alt_search:"Нічого не знайдено на запит: [SEARCH_TERM]. Показано результати на запит: [DIFFERENT_TERM]",search_suggestion:"Нічого не знайдено на запит: [SEARCH_TERM]. Спробуйте один із таких варіантів",searching:"Пошук за запитом: [SEARCH_TERM]"},sa={thanks_to:os,comments:_s,direction:cs,strings:fs},Es={};k(Es,{comments:()=>hs,default:()=>la,direction:()=>ms,strings:()=>Cs,thanks_to:()=>ds});var ds="Long Nhat Nguyen",hs="",ms="ltr",Cs={placeholder:"Tìm kiếm",clear_search:"Xóa",load_more:"Nhiều kết quả hơn",search_label:"Tìm kiếm trong trang này",filters_label:"Bộ lọc",zero_results:"Không tìm thấy kết quả cho [SEARCH_TERM]",many_results:"[COUNT] kết quả cho [SEARCH_TERM]",one_result:"[COUNT] kết quả cho [SEARCH_TERM]",alt_search:"Không tìm thấy kết quả cho [SEARCH_TERM]. Kiểm thị kết quả thay thế với [DIFFERENT_TERM]",search_suggestion:"Không tìm thấy kết quả cho [SEARCH_TERM]. Thử một trong các tìm kiếm:",searching:"Đang tìm kiếm cho [SEARCH_TERM]..."},la={thanks_to:ds,comments:hs,direction:ms,strings:Cs},gs={};k(gs,{comments:()=>Bs,default:()=>aa,direction:()=>As,strings:()=>ps,thanks_to:()=>Rs});var Rs="Amber Song",Bs="",As="ltr",ps={placeholder:"搜索",clear_search:"清除",load_more:"加载更多结果",search_label:"站内搜索",filters_label:"筛选",zero_results:"未找到 [SEARCH_TERM] 的相关结果",many_results:"找到 [COUNT] 个 [SEARCH_TERM] 的相关结果",one_result:"找到 [COUNT] 个 [SEARCH_TERM] 的相关结果",alt_search:"未找到 [SEARCH_TERM] 的相关结果。改为显示 [DIFFERENT_TERM] 的相关结果",search_suggestion:"未找到 [SEARCH_TERM] 的相关结果。请尝试以下搜索。",searching:"正在搜索 [SEARCH_TERM]..."},aa={thanks_to:Rs,comments:Bs,direction:As,strings:ps},vs={};k(vs,{comments:()=>ks,default:()=>na,direction:()=>Fs,strings:()=>bs,thanks_to:()=>Ts});var Ts="Amber Song",ks="",Fs="ltr",bs={placeholder:"搜索",clear_search:"清除",load_more:"加載更多結果",search_label:"站內搜索",filters_label:"篩選",zero_results:"未找到 [SEARCH_TERM] 的相關結果",many_results:"找到 [COUNT] 個 [SEARCH_TERM] 的相關結果",one_result:"找到 [COUNT] 個 [SEARCH_TERM] 的相關結果",alt_search:"未找到 [SEARCH_TERM] 的相關結果。改為顯示 [DIFFERENT_TERM] 的相關結果",search_suggestion:"未找到 [SEARCH_TERM] 的相關結果。請嘗試以下搜索。",searching:"正在搜索 [SEARCH_TERM]..."},na={thanks_to:Ts,comments:ks,direction:Fs,strings:bs},Ms={};k(Ms,{comments:()=>Ds,default:()=>ia,direction:()=>Hs,strings:()=>ws,thanks_to:()=>Ss});var Ss="Amber Song",Ds="",Hs="ltr",ws={placeholder:"搜索",clear_search:"清除",load_more:"加载更多结果",search_label:"站内搜索",filters_label:"筛选",zero_results:"未找到 [SEARCH_TERM] 的相关结果",many_results:"找到 [COUNT] 个 [SEARCH_TERM] 的相关结果",one_result:"找到 [COUNT] 个 [SEARCH_TERM] 的相关结果",alt_search:"未找到 [SEARCH_TERM] 的相关结果。改为显示 [DIFFERENT_TERM] 的相关结果",search_suggestion:"未找到 [SEARCH_TERM] 的相关结果。请尝试以下搜索。",searching:"正在搜索 [SEARCH_TERM]..."},ia={thanks_to:Ss,comments:Ds,direction:Hs,strings:ws},oa=[Bu,ku,Du,zu,Pu,Ku,Yu,ut,at,ct,mt,At,Ft,Ht,jt,Lt,Gt,Xt,tr,nr,fr,Cr,pr,br,wr,Or,xr,Jr,Qr,rs,is,Es,gs,vs,Ms],_a=oa,ca=["../../translations/af.json","../../translations/bn.json","../../translations/ca.json","../../translations/cs.json","../../translations/da.json","../../translations/de.json","../../translations/en.json","../../translations/es.json","../../translations/fi.json","../../translations/fr.json","../../translations/gl.json","../../translations/hi.json","../../translations/hr.json","../../translations/hu.json","../../translations/id.json","../../translations/it.json","../../translations/ja.json","../../translations/ko.json","../../translations/mi.json","../../translations/nl.json","../../translations/no.json","../../translations/pl.json","../../translations/pt.json","../../translations/ro.json","../../translations/ru.json","../../translations/sr.json","../../translations/sv.json","../../translations/sw.json","../../translations/ta.json","../../translations/tr.json","../../translations/uk.json","../../translations/vi.json","../../translations/zh-cn.json","../../translations/zh-tw.json","../../translations/zh.json"];function ou(e,t,u){const r=e.slice();return r[51]=t[u],r}function _u(e){let t,u,r;function s(a){e[37](a)}let l={show_empty_filters:e[5],open_filters:e[6],available_filters:e[18],translate:e[20],automatic_translations:e[19],translations:e[7]};return e[0]!==void 0&&(l.selected_filters=e[0]),t=new bl({props:l}),le.push(()=>il(t,"selected_filters",s)),{c(){Fe(t.$$.fragment)},m(a,n){Ee(t,a,n),r=!0},p(a,n){const i={};n[0]&32&&(i.show_empty_filters=a[5]),n[0]&64&&(i.open_filters=a[6]),n[0]&262144&&(i.available_filters=a[18]),n[0]&524288&&(i.automatic_translations=a[19]),n[0]&128&&(i.translations=a[7]),!u&&n[0]&1&&(u=!0,i.selected_filters=a[0],rl(()=>u=!1)),t.$set(i)},i(a){r||(z(t.$$.fragment,a),r=!0)},o(a){U(t.$$.fragment,a),r=!1},d(a){de(t,a)}}}function cu(e){let t,u,r,s;const l=[Ea,fa],a=[];function n(i,d){return i[14]?0:1}return u=n(e),r=a[u]=l[u](e),{c(){t=p("div"),r.c(),g(t,"class","pagefind-ui__results-area svelte-e9gkc3")},m(i,d){T(i,t,d),a[u].m(t,null),s=!0},p(i,d){let _=u;u=n(i),u===_?a[u].p(i,d):(ae(),U(a[_],1,1,()=>{a[_]=null}),ne(),r=a[u],r?r.p(i,d):(r=a[u]=l[u](i),r.c()),z(r,1),r.m(t,null))},i(i){s||(z(r),s=!0)},o(i){U(r),s=!1},d(i){i&&v(t),a[u].d()}}}function fa(e){let t,u,r,s=[],l=new Map,a,n,i;function d(o,E){return o[13].results.length===0?ma:o[13].results.length===1?ha:da}let _=d(e),h=_(e),m=e[13].results.slice(0,e[17]);const f=o=>o[51].id;for(let o=0;o<m.length;o+=1){let E=ou(e,m,o),B=f(E);l.set(B,s[o]=fu(B,E))}let c=e[13].results.length>e[17]&&Eu(e);return{c(){t=p("p"),h.c(),u=M(),r=p("ol");for(let o=0;o<s.length;o+=1)s[o].c();a=M(),c&&c.c(),n=ee(),g(t,"class","pagefind-ui__message svelte-e9gkc3"),g(r,"class","pagefind-ui__results svelte-e9gkc3")},m(o,E){T(o,t,E),h.m(t,null),T(o,u,E),T(o,r,E);for(let B=0;B<s.length;B+=1)s[B]&&s[B].m(r,null);T(o,a,E),c&&c.m(o,E),T(o,n,E),i=!0},p(o,E){_===(_=d(o))&&h?h.p(o,E):(h.d(1),h=_(o),h&&(h.c(),h.m(t,null))),E[0]&139292&&(m=o[13].results.slice(0,o[17]),ae(),s=nl(s,E,f,1,o,m,l,r,al,fu,null,ou),ne()),o[13].results.length>o[17]?c?c.p(o,E):(c=Eu(o),c.c(),c.m(n.parentNode,n)):c&&(c.d(1),c=null)},i(o){if(!i){for(let E=0;E<m.length;E+=1)z(s[E]);i=!0}},o(o){for(let E=0;E<s.length;E+=1)U(s[E]);i=!1},d(o){o&&v(t),h.d(),o&&v(u),o&&v(r);for(let E=0;E<s.length;E+=1)s[E].d();o&&v(a),c&&c.d(o),o&&v(n)}}}function Ea(e){let t,u=e[16]&&du(e);return{c(){u&&u.c(),t=ee()},m(r,s){u&&u.m(r,s),T(r,t,s)},p(r,s){r[16]?u?u.p(r,s):(u=du(r),u.c(),u.m(t.parentNode,t)):u&&(u.d(1),u=null)},i:P,o:P,d(r){u&&u.d(r),r&&v(t)}}}function da(e){let t=e[20]("many_results",e[19],e[7]).replace(/\[SEARCH_TERM\]/,e[16]).replace(/\[COUNT\]/,new Intl.NumberFormat(e[7].language).format(e[13].results.length))+"",u;return{c(){u=S(t)},m(r,s){T(r,u,s)},p(r,s){s[0]&598144&&t!==(t=r[20]("many_results",r[19],r[7]).replace(/\[SEARCH_TERM\]/,r[16]).replace(/\[COUNT\]/,new Intl.NumberFormat(r[7].language).format(r[13].results.length))+"")&&j(u,t)},d(r){r&&v(u)}}}function ha(e){let t=e[20]("one_result",e[19],e[7]).replace(/\[SEARCH_TERM\]/,e[16]).replace(/\[COUNT\]/,new Intl.NumberFormat(e[7].language).format(1))+"",u;return{c(){u=S(t)},m(r,s){T(r,u,s)},p(r,s){s[0]&589952&&t!==(t=r[20]("one_result",r[19],r[7]).replace(/\[SEARCH_TERM\]/,r[16]).replace(/\[COUNT\]/,new Intl.NumberFormat(r[7].language).format(1))+"")&&j(u,t)},d(r){r&&v(u)}}}function ma(e){let t=e[20]("zero_results",e[19],e[7]).replace(/\[SEARCH_TERM\]/,e[16])+"",u;return{c(){u=S(t)},m(r,s){T(r,u,s)},p(r,s){s[0]&589952&&t!==(t=r[20]("zero_results",r[19],r[7]).replace(/\[SEARCH_TERM\]/,r[16])+"")&&j(u,t)},d(r){r&&v(u)}}}function Ca(e){let t,u;return t=new Cl({props:{show_images:e[2],process_result:e[4],result:e[51]}}),{c(){Fe(t.$$.fragment)},m(r,s){Ee(t,r,s),u=!0},p(r,s){const l={};s[0]&4&&(l.show_images=r[2]),s[0]&16&&(l.process_result=r[4]),s[0]&139264&&(l.result=r[51]),t.$set(l)},i(r){u||(z(t.$$.fragment,r),u=!0)},o(r){U(t.$$.fragment,r),u=!1},d(r){de(t,r)}}}function ga(e){let t,u;return t=new vl({props:{show_images:e[2],process_result:e[4],result:e[51]}}),{c(){Fe(t.$$.fragment)},m(r,s){Ee(t,r,s),u=!0},p(r,s){const l={};s[0]&4&&(l.show_images=r[2]),s[0]&16&&(l.process_result=r[4]),s[0]&139264&&(l.result=r[51]),t.$set(l)},i(r){u||(z(t.$$.fragment,r),u=!0)},o(r){U(t.$$.fragment,r),u=!1},d(r){de(t,r)}}}function fu(e,t){let u,r,s,l,a;const n=[ga,Ca],i=[];function d(_,h){return _[3]?0:1}return r=d(t),s=i[r]=n[r](t),{key:e,first:null,c(){u=ee(),s.c(),l=ee(),this.first=u},m(_,h){T(_,u,h),i[r].m(_,h),T(_,l,h),a=!0},p(_,h){t=_;let m=r;r=d(t),r===m?i[r].p(t,h):(ae(),U(i[m],1,1,()=>{i[m]=null}),ne(),s=i[r],s?s.p(t,h):(s=i[r]=n[r](t),s.c()),z(s,1),s.m(l.parentNode,l))},i(_){a||(z(s),a=!0)},o(_){U(s),a=!1},d(_){_&&v(u),i[r].d(_),_&&v(l)}}}function Eu(e){let t,u=e[20]("load_more",e[19],e[7])+"",r,s,l;return{c(){t=p("button"),r=S(u),g(t,"type","button"),g(t,"class","pagefind-ui__button svelte-e9gkc3")},m(a,n){T(a,t,n),A(t,r),s||(l=G(t,"click",e[22]),s=!0)},p(a,n){n[0]&524416&&u!==(u=a[20]("load_more",a[19],a[7])+"")&&j(r,u)},d(a){a&&v(t),s=!1,l()}}}function du(e){let t,u=e[20]("searching",e[19],e[7]).replace(/\[SEARCH_TERM\]/,e[16])+"",r;return{c(){t=p("p"),r=S(u),g(t,"class","pagefind-ui__message svelte-e9gkc3")},m(s,l){T(s,t,l),A(t,r)},p(s,l){l[0]&589952&&u!==(u=s[20]("searching",s[19],s[7]).replace(/\[SEARCH_TERM\]/,s[16])+"")&&j(r,u)},d(s){s&&v(t)}}}function Ra(e){let t,u,r,s,l,a,n=e[20]("clear_search",e[19],e[7])+"",i,d,_,h,m,f,c,o,E=e[12]&&_u(e),B=e[15]&&cu(e);return{c(){t=p("div"),u=p("form"),r=p("input"),l=M(),a=p("button"),i=S(n),d=M(),_=p("div"),E&&E.c(),h=M(),B&&B.c(),g(r,"class","pagefind-ui__search-input svelte-e9gkc3"),g(r,"type","text"),g(r,"placeholder",s=e[20]("placeholder",e[19],e[7])),g(r,"autocapitalize","none"),g(r,"enterkeyhint","search"),r.autofocus=e[8],g(a,"class","pagefind-ui__search-clear svelte-e9gkc3"),K(a,"pagefind-ui__suppressed",!e[9]),g(_,"class","pagefind-ui__drawer svelte-e9gkc3"),K(_,"pagefind-ui__hidden",!e[15]),g(u,"class","pagefind-ui__form svelte-e9gkc3"),g(u,"role","search"),g(u,"aria-label",m=e[20]("search_label",e[19],e[7])),g(u,"action","javascript:void(0);"),g(t,"class","pagefind-ui svelte-e9gkc3"),K(t,"pagefind-ui--reset",e[1])},m(R,F){T(R,t,F),A(t,u),A(u,r),ze(r,e[9]),e[34](r),A(u,l),A(u,a),A(a,i),e[35](a),A(u,d),A(u,_),E&&E.m(_,null),A(_,h),B&&B.m(_,null),f=!0,e[8]&&r.focus(),c||(o=[G(r,"focus",e[21]),G(r,"keydown",e[32]),G(r,"input",e[33]),G(a,"click",e[36]),G(u,"submit",Ba)],c=!0)},p(R,F){(!f||F[0]&524416&&s!==(s=R[20]("placeholder",R[19],R[7])))&&g(r,"placeholder",s),(!f||F[0]&256)&&(r.autofocus=R[8]),F[0]&512&&r.value!==R[9]&&ze(r,R[9]),(!f||F[0]&524416)&&n!==(n=R[20]("clear_search",R[19],R[7])+"")&&j(i,n),(!f||F[0]&512)&&K(a,"pagefind-ui__suppressed",!R[9]),R[12]?E?(E.p(R,F),F[0]&4096&&z(E,1)):(E=_u(R),E.c(),z(E,1),E.m(_,h)):E&&(ae(),U(E,1,1,()=>{E=null}),ne()),R[15]?B?(B.p(R,F),F[0]&32768&&z(B,1)):(B=cu(R),B.c(),z(B,1),B.m(_,null)):B&&(ae(),U(B,1,1,()=>{B=null}),ne()),(!f||F[0]&32768)&&K(_,"pagefind-ui__hidden",!R[15]),(!f||F[0]&524416&&m!==(m=R[20]("search_label",R[19],R[7])))&&g(u,"aria-label",m),(!f||F[0]&2)&&K(t,"pagefind-ui--reset",R[1])},i(R){f||(z(E),z(B),f=!0)},o(R){U(E),U(B),f=!1},d(R){R&&v(t),e[34](null),e[35](null),E&&E.d(),B&&B.d(),c=!1,W(o)}}}var Ba=e=>e.preventDefault();function Aa(e,t,u){const r={},s=ca.map(C=>C.match(/([^\/]+)\.json$/)[1]);for(let C=0;C<s.length;C++)r[s[C]]={language:s[C],..._a[C].strings};let{base_path:l="/pagefind/"}=t,{page_size:a=5}=t,{reset_styles:n=!0}=t,{show_images:i=!0}=t,{show_sub_results:d=!1}=t,{excerpt_length:_}=t,{process_result:h=null}=t,{process_term:m=null}=t,{show_empty_filters:f=!0}=t,{open_filters:c=[]}=t,{debounce_timeout_ms:o=300}=t,{pagefind_options:E={}}=t,{merge_index:B=[]}=t,{trigger_search_term:R=""}=t,{translations:F={}}=t,{autofocus:N=!1}=t,{sort:q=null}=t,{selected_filters:L={}}=t,b="",D,w,x,ys=40,Ce=!1,be=[],ge=!1,Re=!1,Me=0,Se="",Be=a,De=null,ue=null,He=r.en;const Ns=(C,H,y)=>y[C]??H[C]??"";$s(()=>{let C=document?.querySelector?.("html")?.getAttribute?.("lang")||"en",H=Ru(C.toLocaleLowerCase());u(19,He=r[`${H.language}-${H.script}-${H.region}`]||r[`${H.language}-${H.region}`]||r[`${H.language}`]||r.en)}),el(()=>{D?.destroy?.(),D=null});const we=async()=>{if(!Ce&&(u(12,Ce=!0),!D)){let C;try{C=await Js(()=>import(`${l}pagefind.js`),[])}catch(y){console.error(y),console.error([`Pagefind couldn't be loaded from ${this.options.bundlePath}pagefind.js`,"You can configure this by passing a bundlePath option to PagefindUI"].join(`
 `)),document?.currentScript&&document.currentScript.tagName.toUpperCase()==="SCRIPT"?console.error(`[DEBUG: Loaded from ${document.currentScript.src??"bad script location"}]`):console.error("no known script location")}_||u(24,_=d?12:30);let H={...E||{},excerptLength:_};await C.options(H);for(const y of B){if(!y.bundlePath)throw new Error("mergeIndex requires a bundlePath parameter");const I=y.bundlePath;delete y.bundlePath,await C.mergeIndex(I,y)}D=C,zs()}},zs=async()=>{D&&(De=await D.filters(),(!ue||!Object.keys(ue).length)&&u(18,ue=De))},js=C=>{let H={};return Object.entries(C).filter(([,y])=>y).forEach(([y])=>{let[I,Z]=y.split(/:(.*)$/);H[I]=H[I]||[],H[I].push(Z)}),H};let te;const Os=async(C,H)=>{if(!C){u(15,Re=!1),te&&clearTimeout(te);return}const y=js(H),I=()=>Us(C,y);o>0&&C?(te&&clearTimeout(te),te=setTimeout(I,o),await ye(),D.preload(C,{filters:y})):I(),Is()},ye=async()=>{for(;!D;)we(),await new Promise(C=>setTimeout(C,50))},Us=async(C,H)=>{u(16,Se=C||""),typeof m=="function"&&(C=m(C)),u(14,ge=!0),u(15,Re=!0),await ye();const y=++Me,I={filters:H};q&&typeof q=="object"&&(I.sort=q);const Z=await D.search(C,I);Me===y&&(Z.filters&&Object.keys(Z.filters)?.length&&u(18,ue=Z.filters),u(13,be=Z),u(14,ge=!1),u(17,Be=a))},Is=()=>{const C=x.offsetWidth;C!=ys&&u(10,w.style.paddingRight=`${C+2}px`,w)},Ps=C=>{C?.preventDefault(),u(17,Be+=a)},Ls=C=>{C.key==="Escape"&&(u(9,b=""),w.blur()),C.key==="Enter"&&C.preventDefault()};function xs(){b=this.value,u(9,b),u(23,R)}function qs(C){le[C?"unshift":"push"](()=>{w=C,u(10,w)})}function Vs(C){le[C?"unshift":"push"](()=>{x=C,u(11,x)})}const Ks=()=>{u(9,b=""),w.blur()};function Gs(C){L=C,u(0,L)}return e.$$set=C=>{"base_path"in C&&u(25,l=C.base_path),"page_size"in C&&u(26,a=C.page_size),"reset_styles"in C&&u(1,n=C.reset_styles),"show_images"in C&&u(2,i=C.show_images),"show_sub_results"in C&&u(3,d=C.show_sub_results),"excerpt_length"in C&&u(24,_=C.excerpt_length),"process_result"in C&&u(4,h=C.process_result),"process_term"in C&&u(27,m=C.process_term),"show_empty_filters"in C&&u(5,f=C.show_empty_filters),"open_filters"in C&&u(6,c=C.open_filters),"debounce_timeout_ms"in C&&u(28,o=C.debounce_timeout_ms),"pagefind_options"in C&&u(29,E=C.pagefind_options),"merge_index"in C&&u(30,B=C.merge_index),"trigger_search_term"in C&&u(23,R=C.trigger_search_term),"translations"in C&&u(7,F=C.translations),"autofocus"in C&&u(8,N=C.autofocus),"sort"in C&&u(31,q=C.sort),"selected_filters"in C&&u(0,L=C.selected_filters)},e.$$.update=()=>{e.$$.dirty[0]&8388608&&R&&(u(9,b=R),u(23,R="")),e.$$.dirty[0]&513&&Os(b,L)},[L,n,i,d,h,f,c,F,N,b,w,x,Ce,be,ge,Re,Se,Be,ue,He,Ns,we,Ps,R,_,l,a,m,o,E,B,q,Ls,xs,qs,Vs,Ks,Gs]}var pa=class extends me{constructor(e){super(),he(this,e,Aa,Ra,fe,{base_path:25,page_size:26,reset_styles:1,show_images:2,show_sub_results:3,excerpt_length:24,process_result:4,process_term:27,show_empty_filters:5,open_filters:6,debounce_timeout_ms:28,pagefind_options:29,merge_index:30,trigger_search_term:23,translations:7,autofocus:8,sort:31,selected_filters:0},null,[-1,-1])}},va=pa,ke;try{document?.currentScript&&document.currentScript.tagName.toUpperCase()==="SCRIPT"&&(ke=new URL(document.currentScript.src).pathname.match(/^(.*\/)(?:pagefind-)?ui.js.*$/)[1])}catch{ke="/pagefind/"}var Fa=class{constructor(e){this._pfs=null;let t=e.element??"[data-pagefind-ui]",u=e.bundlePath??ke,r=e.pageSize??5,s=e.resetStyles??!0,l=e.showImages??!0,a=e.showSubResults??!1,n=e.excerptLength??0,i=e.processResult??null,d=e.processTerm??null,_=e.showEmptyFilters??!0,h=e.openFilters??[],m=e.debounceTimeoutMs??300,f=e.mergeIndex??[],c=e.translations??[],o=e.autofocus??!1,E=e.sort??null;delete e.element,delete e.bundlePath,delete e.pageSize,delete e.resetStyles,delete e.showImages,delete e.showSubResults,delete e.excerptLength,delete e.processResult,delete e.processTerm,delete e.showEmptyFilters,delete e.openFilters,delete e.debounceTimeoutMs,delete e.mergeIndex,delete e.translations,delete e.autofocus,delete e.sort;const B=t instanceof HTMLElement?t:document.querySelector(t);B?this._pfs=new va({target:B,props:{base_path:u,page_size:r,reset_styles:s,show_images:l,show_sub_results:a,excerpt_length:n,process_result:i,process_term:d,show_empty_filters:_,open_filters:h,debounce_timeout_ms:m,merge_index:f,translations:c,autofocus:o,sort:E,pagefind_options:e}}):console.error(`Pagefind UI couldn't find the selector ${t}`)}triggerSearch(e){this._pfs.$$set({trigger_search_term:e})}triggerFilters(e){let t={};for(let[u,r]of Object.entries(e))if(Array.isArray(r))for(let s of r)t[`${u}:${s}`]=!0;else t[`${u}:${r}`]=!0;this._pfs.$$set({selected_filters:t})}destroy(){this._pfs.$destroy()}};export{Fa as PagefindUI};
diff --git a/snapshots/tng/elements/dialog/index.html b/snapshots/tng/elements/dialog/index.html
index 0b4264a2b..ad50aceb6 100644
--- a/snapshots/tng/elements/dialog/index.html
+++ b/snapshots/tng/elements/dialog/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/flickable/index.html b/snapshots/tng/elements/flickable/index.html
index bfae766a5..d4122167a 100644
--- a/snapshots/tng/elements/flickable/index.html
+++ b/snapshots/tng/elements/flickable/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/focusscope/index.html b/snapshots/tng/elements/focusscope/index.html
index c6b4ebea2..fae786011 100644
--- a/snapshots/tng/elements/focusscope/index.html
+++ b/snapshots/tng/elements/focusscope/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/gridlayout/index.html b/snapshots/tng/elements/gridlayout/index.html
index 2dde71464..acba224bb 100644
--- a/snapshots/tng/elements/gridlayout/index.html
+++ b/snapshots/tng/elements/gridlayout/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/horizontallayout/index.html b/snapshots/tng/elements/horizontallayout/index.html
index 76f97882b..1c98e3aae 100644
--- a/snapshots/tng/elements/horizontallayout/index.html
+++ b/snapshots/tng/elements/horizontallayout/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/image/index.html b/snapshots/tng/elements/image/index.html
index 1d0bd239a..b7156e33a 100644
--- a/snapshots/tng/elements/image/index.html
+++ b/snapshots/tng/elements/image/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/path/index.html b/snapshots/tng/elements/path/index.html
index aef08564a..24ebebd75 100644
--- a/snapshots/tng/elements/path/index.html
+++ b/snapshots/tng/elements/path/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/popupwindow/index.html b/snapshots/tng/elements/popupwindow/index.html
index faede1af6..e42fd69ba 100644
--- a/snapshots/tng/elements/popupwindow/index.html
+++ b/snapshots/tng/elements/popupwindow/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/rectangle/index.html b/snapshots/tng/elements/rectangle/index.html
index ded896400..bfafbba9f 100644
--- a/snapshots/tng/elements/rectangle/index.html
+++ b/snapshots/tng/elements/rectangle/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/swipegestrurehandler/index.html b/snapshots/tng/elements/swipegestrurehandler/index.html
index b08dcc8cd..39d24f529 100644
--- a/snapshots/tng/elements/swipegestrurehandler/index.html
+++ b/snapshots/tng/elements/swipegestrurehandler/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/text/index.html b/snapshots/tng/elements/text/index.html
index 424a3ba71..69d549bb3 100644
--- a/snapshots/tng/elements/text/index.html
+++ b/snapshots/tng/elements/text/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/textinput/index.html b/snapshots/tng/elements/textinput/index.html
index dcf9e8814..1bf526906 100644
--- a/snapshots/tng/elements/textinput/index.html
+++ b/snapshots/tng/elements/textinput/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/timer/index.html b/snapshots/tng/elements/timer/index.html
index eac47bde6..4e2c9deb6 100644
--- a/snapshots/tng/elements/timer/index.html
+++ b/snapshots/tng/elements/timer/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/toucharea/index.html b/snapshots/tng/elements/toucharea/index.html
index e87c0c0b3..faf804d6e 100644
--- a/snapshots/tng/elements/toucharea/index.html
+++ b/snapshots/tng/elements/toucharea/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/verticallayout/index.html b/snapshots/tng/elements/verticallayout/index.html
index 528577f04..6bef46233 100644
--- a/snapshots/tng/elements/verticallayout/index.html
+++ b/snapshots/tng/elements/verticallayout/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/elements/window/index.html b/snapshots/tng/elements/window/index.html
index 4f1100fa0..a713899a0 100644
--- a/snapshots/tng/elements/window/index.html
+++ b/snapshots/tng/elements/window/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/getting-started/intro/index.html b/snapshots/tng/getting-started/intro/index.html
index 5db0c2367..590ee4103 100644
--- a/snapshots/tng/getting-started/intro/index.html
+++ b/snapshots/tng/getting-started/intro/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
@@ -81,10 +81,7 @@
 		})();
 	</script> </sl-sidebar-state-persist>  <div class="md:sl-hidden"> <div class="mobile-preferences sl-flex astro-qyfhjkv4"> <div class="sl-flex social-icons astro-qyfhjkv4"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#setting-up-vscode" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Setting up VSCode</span> </a> <ul class="isMobile astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#slint-project-structure" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Slint project structure</span> </a>  </li> </ul>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#setting-up-vscode" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Setting up VSCode</span> </a> <ul class="astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#slint-project-structure" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Slint project structure</span> </a>  </li> </ul>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">Getting started</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <img src="/tng/_astro/mattermost-logo-light.DpTp-7cz_9zQW5.svg" class="light:sl-hidden" loading="lazy" alt="A description of my image." width="50" height="50" decoding="async">
-<img src="/tng/_astro/mattermost-logo-dark.ButNiD4U_Wo44T.svg" class="dark:sl-hidden" loading="lazy" alt="A description of my image." width="50" height="50" decoding="async">
-<p>As a first step we invite you to join our community on <a href="https://chat.slint.dev/">Mattermost</a>. This is a great place to ask questions and get help from other Slint users.</p>
-<p>This guide will help you get started with Slint. It will cover the basics of the language and how to get started with the Slint extension for Visual Studio Code.</p>
+</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#setting-up-vscode" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Setting up VSCode</span> </a> <ul class="isMobile astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#slint-project-structure" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Slint project structure</span> </a>  </li> </ul>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#setting-up-vscode" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Setting up VSCode</span> </a> <ul class="astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#slint-project-structure" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Slint project structure</span> </a>  </li> </ul>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">Getting started</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <p>This guide will help you get started with Slint. It will cover the basics of the language and how to get started with the Slint extension for Visual Studio Code.</p>
 <h2 id="setting-up-vscode">Setting up VSCode</h2>
 <starlight-tabs data-sync-key="dev-platform" class="astro-oqf2tref"> <div class="tablist-wrapper not-content astro-oqf2tref"> <ul role="tablist" class="astro-oqf2tref"> <li role="presentation" class="tab astro-oqf2tref"> <a role="tab" href="#tab-panel-3" id="tab-3" aria-selected="true" tabindex="0" class="astro-oqf2tref"> <svg aria-hidden="true" class="astro-oqf2tref astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M0.125 11.544L0.125 3.450L9.815 2.120L9.815 11.506L0.125 11.544ZM0.125 12.532L9.815 12.570L9.815 21.956L0.125 20.626L0.125 12.532ZM10.993 11.468L10.993 1.968L23.837 0.106L23.837 11.392L10.993 11.468ZM10.955 12.646L23.875 12.684L23.837 23.894L10.993 22.108L10.955 12.646Z"/></svg>  Windows </a> </li><li role="presentation" class="tab astro-oqf2tref"> <a role="tab" href="#tab-panel-4" id="tab-4" aria-selected="false" tabindex="-1" class="astro-oqf2tref"> <svg aria-hidden="true" class="astro-oqf2tref astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M14.94 5.19A4.38 4.38 0 0 0 16 2a4.44 4.44 0 0 0-3 1.52 4.17 4.17 0 0 0-1 3.09 3.69 3.69 0 0 0 2.94-1.42Zm2.52 7.44a4.51 4.51 0 0 1 2.16-3.81 4.66 4.66 0 0 0-3.66-2c-1.56-.16-3 .91-3.83.91s-2-.89-3.3-.87a4.92 4.92 0 0 0-4.14 2.53C2.93 12.45 4.24 17 6 19.47c.8 1.21 1.8 2.58 3.12 2.53s1.75-.82 3.28-.82 2 .82 3.3.79 2.22-1.24 3.06-2.45a11 11 0 0 0 1.38-2.85 4.41 4.41 0 0 1-2.68-4.04Z"/></svg>  macOS </a> </li><li role="presentation" class="tab astro-oqf2tref"> <a role="tab" href="#tab-panel-5" id="tab-5" aria-selected="false" tabindex="-1" class="astro-oqf2tref"> <svg aria-hidden="true" class="astro-oqf2tref astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M19.7 17.6c-.1-.2-.2-.4-.2-.6 0-.4-.2-.7-.5-1-.1-.1-.3-.2-.4-.2.6-1.8-.3-3.6-1.3-4.9-.8-1.2-2-2.1-1.9-3.7 0-1.9.2-5.4-3.3-5.1-3.6.2-2.6 3.9-2.7 5.2 0 1.1-.5 2.2-1.3 3.1-.2.2-.4.5-.5.7-1 1.2-1.5 2.8-1.5 4.3-.2.2-.4.4-.5.6-.1.1-.2.2-.2.3-.1.1-.3.2-.5.3-.4.1-.7.3-.9.7-.1.3-.2.7-.1 1.1.1.2.1.4 0 .7-.2.4-.2.9 0 1.4.3.4.8.5 1.5.6.5 0 1.1.2 1.6.4.5.3 1.1.5 1.7.5.3 0 .7-.1 1-.2.3-.2.5-.4.6-.7.4 0 1-.2 1.7-.2.6 0 1.2.2 2 .1 0 .1 0 .2.1.3.2.5.7.9 1.3 1h.2c.8-.1 1.6-.5 2.1-1.1.4-.4.9-.7 1.4-.9.6-.3 1-.5 1.1-1 .1-.7-.1-1.1-.5-1.7zM12.8 4.8c.6.1 1.1.6 1 1.2 0 .3-.1.6-.3.9h-.1c-.2-.1-.3-.1-.4-.2.1-.1.1-.3.2-.5 0-.4-.2-.7-.4-.7-.3 0-.5.3-.5.7v.1c-.1-.1-.3-.1-.4-.2V6c-.1-.5.3-1.1.9-1.2zm-.3 2c.1.1.3.2.4.2.1 0 .3.1.4.2.2.1.4.2.4.5s-.3.6-.9.8c-.2.1-.3.1-.4.2-.3.2-.6.3-1 .3-.3 0-.6-.2-.8-.4-.1-.1-.2-.2-.4-.3-.1-.1-.3-.3-.4-.6 0-.1.1-.2.2-.3.3-.2.4-.3.5-.4l.1-.1c.2-.3.6-.5 1-.5.3.1.6.2.9.4zM10.4 5c.4 0 .7.4.8 1.1v.2c-.1 0-.3.1-.4.2v-.2c0-.3-.2-.6-.4-.5-.2 0-.3.3-.3.6 0 .2.1.3.2.4 0 0-.1.1-.2.1-.2-.2-.4-.5-.4-.8 0-.6.3-1.1.7-1.1zm-1 16.1c-.7.3-1.6.2-2.2-.2-.6-.3-1.1-.4-1.8-.4-.5-.1-1-.1-1.1-.3-.1-.2-.1-.5.1-1 .1-.3.1-.6 0-.9-.1-.3-.1-.5 0-.8.1-.3.3-.4.6-.5.3-.1.5-.2.7-.4.1-.1.2-.2.3-.4.3-.4.5-.6.8-.6.6.1 1.1 1 1.5 1.9.2.3.4.7.7 1 .4.5.9 1.2.9 1.6 0 .5-.2.8-.5 1zm4.9-2.2c0 .1 0 .1-.1.2-1.2.9-2.8 1-4.1.3l-.6-.9c.9-.1.7-1.3-1.2-2.5-2-1.3-.6-3.7.1-4.8.1-.1.1 0-.3.8-.3.6-.9 2.1-.1 3.2 0-.8.2-1.6.5-2.4.7-1.3 1.2-2.8 1.5-4.3.1.1.1.1.2.1.1.1.2.2.3.2.2.3.6.4.9.4h.1c.4 0 .8-.1 1.1-.4.1-.1.2-.2.4-.2.3-.1.6-.3.9-.6.4 1.3.8 2.5 1.4 3.6.4.8.7 1.6.9 2.5.3 0 .7.1 1 .3.8.4 1.1.7 1 1.2H18c0-.3-.2-.6-.9-.9-.7-.3-1.3-.3-1.5.4-.1 0-.2.1-.3.1-.8.4-.8 1.5-.9 2.6.1.4 0 .7-.1 1.1zm4.6.6c-.6.2-1.1.6-1.5 1.1-.4.6-1.1 1-1.9.9-.4 0-.8-.3-.9-.7-.1-.6-.1-1.2.2-1.8.1-.4.2-.7.3-1.1.1-1.2.1-1.9.6-2.2 0 .5.3.8.7 1 .5 0 1-.1 1.4-.5h.2c.3 0 .5 0 .7.2.2.2.3.5.3.7 0 .3.2.6.3.9.5.5.5.8.5.9-.1.2-.5.4-.9.6zm-9-12c-.1 0-.1 0-.1.1 0 0 0 .1.1.1s.1.1.1.1c.3.4.8.6 1.4.7.5-.1 1-.2 1.5-.6l.6-.3c.1 0 .1-.1.1-.1 0-.1 0-.1-.1-.1-.2.1-.5.2-.7.3-.4.3-.9.5-1.4.5-.5 0-.9-.3-1.2-.6-.1 0-.2-.1-.3-.1z"/></svg>  Linux </a> </li> </ul> </div> <section id="tab-panel-3" aria-labelledby="tab-3" role="tabpanel"> <ol role="list" class="sl-steps">
 <li>Install VSCode.<br>
@@ -151,4 +148,4 @@ <h3 id="slint-project-structure">Slint project structure</h3>
 </span></span></summary><ul><li class="file"><span class="tree-entry"><span class=""><span><svg width="16" height="16" class="tree-icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M18.419 2.539L18.419 2.983L18.419 3.686L18.530 3.797L18.642 3.797Q18.826 3.760 19.178 3.704Q19.529 3.649 19.696 3.575Q19.863 3.501 19.992 3.630Q20.122 3.760 20.047 3.926Q19.973 4.093 19.918 4.444Q19.863 4.796 19.825 4.981L19.825 4.981L19.825 5.092L19.936 5.203Q19.936 5.314 20.159 5.314L20.159 5.314L21.194 5.314Q21.564 5.314 21.527 5.647L21.527 5.647L21.527 5.906Q21.453 6.128 21.232 6.572L21.232 6.572L21.084 6.831L21.084 6.942L21.157 7.016Q21.194 7.090 21.194 7.164L21.194 7.164L21.305 7.164Q21.491 7.238 21.842 7.293Q22.194 7.349 22.360 7.367Q22.526 7.386 22.601 7.589Q22.674 7.793 22.601 7.978L22.601 7.978L22.305 8.385Q22.082 8.644 22.008 8.792L22.008 8.792L22.008 9.014Q22.008 9.088 22.119 9.162L22.119 9.162L22.230 9.236L23.155 9.606Q23.340 9.680 23.396 9.846Q23.451 10.013 23.267 10.161L23.267 10.161Q22.822 10.642 22.489 10.864L22.489 10.864L22.489 11.197L22.526 11.271Q22.637 11.308 22.712 11.308L22.712 11.308L22.970 11.493Q23.303 11.715 23.488 11.789Q23.674 11.863 23.674 12.066Q23.674 12.270 23.526 12.381L23.526 12.381L22.601 12.936L22.601 13.047Q22.601 13.232 22.601 13.269Q22.601 13.306 22.712 13.417L22.712 13.417Q23.155 13.861 23.415 13.972L23.415 13.972Q23.563 14.157 23.507 14.305Q23.451 14.453 23.267 14.564L23.267 14.564Q22.601 14.786 22.341 14.897L22.341 14.897L22.305 14.934Q22.230 14.971 22.194 15.045Q22.156 15.119 22.230 15.267L22.230 15.267L22.230 15.378Q22.415 15.526 22.637 15.933L22.637 15.933L22.822 16.192Q22.896 16.266 22.878 16.414Q22.860 16.562 22.712 16.636L22.712 16.636L22.601 16.673L22.453 16.747Q22.305 16.747 22.008 16.821Q21.712 16.895 21.564 16.895L21.564 16.895L21.416 16.895Q21.416 16.932 21.361 16.987Q21.305 17.043 21.305 17.117L21.305 17.117L21.343 17.228L21.416 17.339L21.787 18.153Q21.860 18.227 21.805 18.375Q21.749 18.523 21.675 18.597L21.675 18.597L20.270 18.597Q20.159 18.745 20.159 18.967L20.159 18.967Q20.232 19.115 20.288 19.411Q20.343 19.707 20.418 19.873Q20.491 20.040 20.343 20.188Q20.195 20.336 19.936 20.336L19.936 20.336Q19.752 20.299 19.400 20.243Q19.049 20.188 18.901 20.114L18.901 20.114L18.790 20.114L18.604 20.299Q18.567 20.336 18.642 20.336L18.642 20.336L18.642 21.372Q18.642 21.742 18.308 21.742L18.308 21.742L18.087 21.742Q17.605 21.594 17.162 21.261L17.162 21.261L17.050 21.261Q16.939 21.261 16.866 21.335Q16.791 21.409 16.791 21.520L16.791 21.520Q16.791 21.668 16.736 21.964Q16.680 22.260 16.680 22.426Q16.680 22.593 16.477 22.667Q16.273 22.741 16.125 22.667L16.125 22.667Q15.756 22.297 15.311 22.075L15.311 22.075L15.200 22.075Q15.090 22.075 15.015 22.149Q14.942 22.223 14.942 22.297L14.942 22.297L14.608 23.222Q14.497 23.481 14.276 23.481L14.276 23.481Q14.201 23.481 14.165 23.407L14.165 23.407L14.128 23.370Q13.683 22.889 13.462 22.556L13.462 22.556L13.203 22.556Q13.128 22.556 13.055 22.630Q12.980 22.704 12.980 22.778L12.980 22.778L12.537 23.592Q12.425 23.740 12.222 23.740Q12.018 23.740 11.945 23.592L11.945 23.592L11.352 22.667L11.020 22.667L10.206 23.481Q10.095 23.592 9.762 23.592L9.762 23.592Q9.651 23.592 9.651 23.370L9.651 23.370L9.280 22.260Q9.243 22.186 9.169 22.186L9.169 22.186L8.837 22.186Q8.651 22.371 8.281 22.593L8.281 22.593L8.023 22.778L7.800 22.667Q7.467 22.519 7.338 22.426Q7.208 22.334 7.208 22.186L7.208 22.186Q7.097 21.853 7.097 21.150L7.097 21.150L7.060 21.113Q7.060 21.039 6.986 21.039Q6.912 21.039 6.857 20.983Q6.801 20.928 6.764 20.928L6.764 20.928L6.616 20.928L6.505 21.039L5.691 21.372Q5.543 21.483 5.395 21.409Q5.247 21.335 5.247 21.150L5.247 21.150L5.247 19.892L5.136 19.781L5.026 19.781Q4.840 19.818 4.489 19.873Q4.138 19.929 3.971 20.003Q3.804 20.077 3.675 19.947Q3.545 19.818 3.619 19.651Q3.693 19.485 3.749 19.133Q3.804 18.782 3.841 18.597L3.841 18.597L3.841 18.486L3.731 18.375L2.583 18.375Q2.250 18.375 2.250 18.042L2.250 18.042L2.250 17.783Q2.324 17.561 2.583 17.117L2.583 17.117L2.694 16.858L2.694 16.710Q2.657 16.636 2.583 16.636L2.583 16.636Q2.583 16.562 2.510 16.562L2.510 16.562L2.472 16.525Q2.287 16.525 1.936 16.469Q1.584 16.414 1.418 16.414Q1.251 16.414 1.177 16.210Q1.103 16.007 1.214 15.822L1.214 15.822Q1.548 15.489 1.769 15.008L1.769 15.008L1.769 14.786L1.584 14.638Q1.510 14.564 1.436 14.564L1.436 14.564L0.622 14.231Q0.437 14.120 0.382 13.953Q0.326 13.787 0.511 13.639L0.511 13.639Q0.696 13.565 1.066 13.269L1.066 13.269Q1.288 13.047 1.436 12.936L1.436 12.936L1.436 12.714Q1.436 12.492 1.325 12.492L1.325 12.492L0.511 12.011Q0.326 11.937 0.326 11.733Q0.326 11.530 0.511 11.456L0.511 11.456L1.436 10.864L1.436 10.642L0.622 9.828Q0.548 9.754 0.548 9.606Q0.548 9.458 0.622 9.347L0.622 9.347L0.659 9.347Q0.733 9.310 0.733 9.236L0.733 9.236L1.769 8.903L1.769 8.792Q1.843 8.718 1.806 8.533L1.806 8.533L1.769 8.422Q1.658 8.311 1.492 8.089Q1.325 7.867 1.214 7.719Q1.103 7.571 1.177 7.367Q1.251 7.164 1.418 7.127Q1.584 7.090 1.936 7.034Q2.287 6.979 2.472 6.942L2.472 6.942L2.583 6.942Q2.583 6.868 2.639 6.812Q2.694 6.757 2.694 6.683L2.694 6.683L2.694 6.572L2.583 6.461L2.250 5.647Q2.139 5.499 2.213 5.351Q2.287 5.203 2.472 5.203L2.472 5.203L3.731 5.203L3.767 5.129Q3.767 5.092 3.841 5.092L3.841 5.092L3.841 4.981Q3.619 4.278 3.619 3.945L3.619 3.945Q3.545 3.760 3.675 3.630Q3.804 3.501 3.989 3.575L3.989 3.575Q4.322 3.575 5.026 3.797L5.026 3.797L5.136 3.797L5.284 3.649Q5.321 3.575 5.247 3.575L5.247 3.575L5.247 2.539Q5.247 2.206 5.580 2.206L5.580 2.206L5.840 2.206Q6.061 2.280 6.505 2.539L6.505 2.539L6.764 2.650L6.912 2.650Q6.986 2.613 6.986 2.539L6.986 2.539Q7.060 2.539 7.060 2.465L7.060 2.465L7.097 2.428Q7.097 2.243 7.153 1.891Q7.208 1.540 7.208 1.373Q7.208 1.207 7.412 1.133Q7.615 1.059 7.800 1.133L7.800 1.133Q8.133 1.503 8.614 1.725L8.614 1.725L8.837 1.725L8.947 1.614L8.947 1.540Q8.985 1.466 9.058 1.392L9.058 1.392L9.392 0.578Q9.503 0.430 9.576 0.393Q9.651 0.356 9.872 0.356L9.872 0.356L9.983 0.467Q10.058 0.652 10.354 1.022L10.354 1.022Q10.576 1.244 10.686 1.392L10.686 1.392L10.797 1.392Q10.872 1.392 10.945 1.318L10.945 1.318L11.020 1.281L11.500 0.467Q11.648 0.282 11.815 0.263Q11.982 0.245 12.055 0.356L12.055 0.356L12.166 0.467L12.759 1.392L13.091 1.392Q13.166 1.392 13.203 1.318L13.203 1.318L13.239 1.281Q13.683 0.800 13.794 0.578L13.794 0.578Q13.869 0.504 14.017 0.504Q14.165 0.504 14.276 0.578L14.276 0.578L14.276 0.689Q14.497 1.392 14.608 1.614L14.608 1.614L14.720 1.725L14.942 1.725Q15.459 1.540 15.866 1.133L15.866 1.133Q16.052 1.059 16.255 1.133Q16.459 1.207 16.459 1.373Q16.459 1.540 16.514 1.891Q16.569 2.243 16.569 2.428L16.569 2.428L16.607 2.465Q16.607 2.539 16.680 2.539L16.680 2.539L16.791 2.539Q16.902 2.613 16.976 2.613Q17.050 2.613 17.050 2.539L17.050 2.539Q17.273 2.428 17.976 2.206L17.976 2.206Q18.160 2.095 18.290 2.187Q18.419 2.280 18.419 2.539L18.419 2.539ZM5.580 6.128L5.580 6.128L14.386 6.128Q15.090 6.128 15.422 6.239L15.422 6.239Q16.532 6.609 17.050 7.275L17.050 7.275Q17.605 7.867 17.605 8.681L17.605 8.681Q17.605 9.347 17.273 10.050L17.273 10.050Q16.902 10.605 16.348 10.975L16.348 10.975Q16.125 11.197 15.977 11.197L15.977 11.197Q16.052 11.271 16.163 11.326Q16.273 11.382 16.348 11.456L16.348 11.456L16.532 11.604Q16.939 11.974 17.050 12.233L17.050 12.233Q17.383 12.788 17.383 13.417L17.383 13.417Q17.383 13.528 17.605 13.750L17.605 13.750Q17.753 13.898 18.049 13.972L18.049 13.972Q18.197 13.972 18.549 13.972Q18.901 13.972 19.122 13.750L19.122 13.750Q19.270 13.602 19.381 13.306L19.381 13.306L19.456 13.047L19.456 12.492Q19.456 12.381 19.474 12.381Q19.492 12.381 19.566 12.381L19.566 12.381L20.380 12.381L20.380 10.864Q20.232 10.790 19.881 10.623Q19.529 10.457 19.345 10.383L19.345 10.383Q19.308 10.346 19.122 10.290Q18.938 10.235 18.901 10.161L18.901 10.161Q18.346 9.976 18.530 9.236L18.530 9.236Q19.011 8.089 19.345 7.497L19.345 7.497L19.345 7.386Q18.901 6.683 18.642 6.387L18.642 6.387Q18.197 5.832 17.716 5.425L17.716 5.425Q16.014 3.871 13.573 3.353L13.573 3.353L13.462 3.353Q12.759 4.056 12.314 4.389L12.314 4.389Q12.130 4.574 11.834 4.574Q11.538 4.574 11.352 4.389L11.352 4.389L10.317 3.353L10.206 3.353Q9.762 3.464 9.058 3.686L9.058 3.686Q7.245 4.352 5.802 5.758L5.802 5.758Q5.580 6.017 5.580 6.128ZM18.642 16.747L18.642 16.747L15.200 16.747Q14.831 16.747 14.720 16.636L14.720 16.636Q14.128 16.340 13.905 15.489L13.905 15.489L13.869 15.267Q13.683 14.601 13.683 14.231L13.683 14.231Q13.683 13.972 13.480 13.528Q13.276 13.084 12.944 12.843Q12.610 12.603 12.166 12.603L12.166 12.603L10.095 12.603L10.095 14.083L12.166 14.083Q12.277 14.083 12.296 14.101Q12.314 14.120 12.314 14.231L12.314 14.231L12.314 16.525Q12.314 16.599 12.296 16.617Q12.277 16.636 12.166 16.636L12.166 16.636L5.247 16.636Q5.469 17.006 5.950 17.450L5.950 17.450L6.061 17.450Q6.986 17.228 7.430 17.228L7.430 17.228Q7.689 17.154 7.930 17.283Q8.171 17.413 8.244 17.672L8.244 17.672L8.614 19.189L8.614 19.300Q9.540 19.670 9.983 19.781L9.983 19.781Q10.761 20.003 11.352 20.003L11.352 20.003Q11.907 20.077 12.573 20.040L12.573 20.040Q12.980 20.003 13.794 19.892L13.794 19.892Q14.386 19.781 15.534 19.300L15.534 19.300L15.534 19.189L15.866 17.672Q16.088 17.080 16.680 17.228L16.680 17.228L18.087 17.561L18.197 17.561Q18.197 17.228 18.642 16.747ZM6.283 8.681L4.914 8.681L5.247 9.347L5.284 9.458Q5.321 9.643 5.247 9.717L5.247 9.717Q5.247 9.902 4.988 10.087L4.988 10.087L4.914 10.161Q3.989 10.642 3.508 10.753L3.508 10.753L3.434 10.753Q3.397 10.790 3.397 10.864L3.397 10.864L3.397 11.456Q3.397 12.603 3.731 13.972L3.731 13.972L3.767 14.046Q3.767 14.120 3.841 14.120L3.841 14.120L6.283 14.120L6.283 8.681ZM9.872 10.272L9.872 10.272Q9.910 10.272 9.947 10.272L9.947 10.272L9.872 10.272L12.537 10.272Q12.980 10.272 13.239 10.161L13.239 10.161L13.351 10.087Q13.498 9.976 13.573 9.809Q13.646 9.643 13.628 9.402Q13.610 9.162 13.462 9.014L13.462 9.014Q13.091 8.681 12.648 8.681L12.648 8.681L9.762 8.681Q9.872 9.236 9.872 10.272ZM2.917 9.125L2.917 9.125Q2.917 9.384 3.138 9.606Q3.360 9.828 3.619 9.828Q3.878 9.828 4.100 9.606Q4.322 9.384 4.322 9.125Q4.322 8.866 4.100 8.644Q3.878 8.422 3.619 8.422Q3.360 8.422 3.138 8.644Q2.917 8.866 2.917 9.125ZM17.605 18.856L17.605 18.856Q17.605 18.597 17.402 18.375Q17.198 18.153 16.921 18.153Q16.643 18.153 16.440 18.375Q16.236 18.597 16.236 18.856Q16.236 19.115 16.440 19.318Q16.643 19.522 16.921 19.522Q17.198 19.522 17.402 19.337Q17.605 19.152 17.605 18.856ZM6.764 18.153L6.764 18.153Q6.468 18.153 6.265 18.375Q6.061 18.597 6.061 18.856Q6.061 19.115 6.265 19.318Q6.468 19.522 6.746 19.522Q7.023 19.522 7.227 19.318Q7.430 19.115 7.430 18.856Q7.430 18.597 7.227 18.375Q7.023 18.153 6.764 18.153ZM12.537 2.983L12.537 2.983Q12.537 2.724 12.352 2.520Q12.166 2.317 11.852 2.317Q11.538 2.317 11.334 2.502Q11.131 2.687 11.131 2.983Q11.131 3.279 11.316 3.482Q11.500 3.686 11.834 3.686L11.834 3.686Q12.314 3.686 12.537 2.983ZM20.047 9.939L20.047 9.939Q20.306 9.939 20.529 9.717Q20.750 9.495 20.750 9.236Q20.750 8.977 20.529 8.755Q20.306 8.533 20.047 8.533Q19.788 8.533 19.566 8.755Q19.345 8.977 19.345 9.254Q19.345 9.532 19.529 9.735Q19.715 9.939 20.047 9.939Z"></path></svg></span>main.rs</span></span></li></ul></details></li><li class="directory"><details open><summary><span class="tree-entry"><span class=""><span><span class="sr-only">Directory</span><svg width="16" height="16" class="tree-icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M22.073 4.900L22.073 4.900L12.148 4.900L12.148 3.950Q12.148 3.125 11.585 2.563Q11.023 2 10.198 2L10.198 2L0.048 2L0.048 22L23.948 22L23.948 6.850Q23.998 6.025 23.448 5.462Q22.898 4.900 22.073 4.900Z"></path></svg></span>target/
 </span></span></summary><ul><li class="directory"><details><summary><span class="tree-entry"><span class=""><span><span class="sr-only">Directory</span><svg width="16" height="16" class="tree-icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M22.073 4.900L22.073 4.900L12.148 4.900L12.148 3.950Q12.148 3.125 11.585 2.563Q11.023 2 10.198 2L10.198 2L0.048 2L0.048 22L23.948 22L23.948 6.850Q23.998 6.025 23.448 5.462Q22.898 4.900 22.073 4.900Z"></path></svg></span>debug/</span></span></summary><ul><li class="file empty"><span class="tree-entry"><span class="">…</span></span></li></ul></details></li><li class="file"><span class="tree-entry"><span class=""><span><svg width="16" height="16" class="tree-icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M0.734 13.269L0.562 10.732Q1.938 10.732 2.497 10.087L2.497 10.087Q2.884 9.614 2.884 8.711L2.884 8.711Q2.884 8.324 2.798 7.571Q2.712 6.819 2.712 6.410Q2.712 6.002 2.669 5.185L2.669 5.185Q2.583 4.454 2.583 4.153L2.583 4.153Q2.583 2.089 3.787 1.099Q4.991 0.111 7.184 0.111L7.184 0.111L8.259 0.111L8.259 2.648L7.700 2.648Q6.754 2.648 6.345 3.185Q5.937 3.723 5.937 4.798L5.937 4.798Q5.937 5.056 6.023 5.572L6.023 5.572Q6.109 6.217 6.109 6.561L6.109 6.561Q6.109 6.819 6.152 7.378L6.152 7.378Q6.238 8.152 6.238 8.582L6.238 8.582Q6.238 10.216 5.550 11.033L5.550 11.033Q4.948 11.764 3.658 12.065L3.658 12.065Q4.948 12.409 5.550 13.097L5.550 13.097Q6.238 13.957 6.238 15.548L6.238 15.548Q6.238 16.021 6.152 16.795L6.152 16.795Q6.066 17.354 6.088 17.612Q6.109 17.870 6.023 18.515L6.023 18.515Q5.937 18.988 5.937 19.203L5.937 19.203Q5.937 20.278 6.345 20.815Q6.754 21.353 7.700 21.353L7.700 21.353L8.259 21.353L8.259 23.890L7.184 23.890Q2.712 23.890 2.712 19.848L2.712 19.848Q2.712 18.386 2.862 17.590Q3.013 16.795 3.013 15.290L3.013 15.290Q3.013 13.269 0.734 13.269L0.734 13.269ZM23.438 10.732L23.438 13.011Q21.159 13.011 21.159 15.032L21.159 15.032Q21.159 15.419 21.224 16.171Q21.288 16.924 21.288 17.311L21.288 17.311Q21.417 18.128 21.417 19.590L21.417 19.590Q21.417 23.632 16.859 23.632L16.859 23.632L15.784 23.632L15.784 21.353L16.300 21.353Q17.246 21.353 17.654 20.815Q18.063 20.278 18.063 19.203Q18.063 18.128 17.934 17.569L17.934 17.569Q17.934 17.225 17.848 16.558Q17.762 15.892 17.762 15.548L17.762 15.548Q17.762 13.957 18.450 13.097L18.450 13.097Q19.052 12.409 20.342 12.065L20.342 12.065Q19.052 11.764 18.450 11.033L18.450 11.033Q17.762 10.216 17.762 8.582L17.762 8.582Q17.762 8.152 17.848 7.378L17.848 7.378Q17.934 6.819 17.934 6.561L17.934 6.561Q18.063 5.873 18.063 4.841Q18.063 3.809 17.633 3.293Q17.203 2.777 16.300 2.648L16.300 2.648L15.784 2.648L15.784 0.111L16.859 0.111Q19.009 0.111 20.213 1.099Q21.417 2.089 21.417 4.153L21.417 4.153Q21.417 4.540 21.352 5.292Q21.288 6.045 21.288 6.432L21.288 6.432Q21.159 7.249 21.116 8.711L21.116 8.711Q21.159 9.614 21.503 10.087L21.503 10.087Q22.062 10.732 23.438 10.732L23.438 10.732Z"></path></svg></span>.rustc_info.json</span></span></li><li class="file"><span class="tree-entry"><span class=""><span><svg width="16" height="16" class="tree-icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M1.082 16.876L1.082 14.014L22.918 14.014L22.918 16.876L1.082 16.876ZM1.082 9.986L1.082 7.071L13.272 7.071L13.272 9.986L1.082 9.986ZM1.082 3.096L1.082 0.181L22.918 0.181L22.918 3.096L1.082 3.096ZM1.082 23.819L1.082 20.904L17.300 20.904L17.300 23.819L1.082 23.819Z"></path></svg></span>CACHEDIR.TAG</span></span></li></ul></details></li><li class="directory"><details open><summary><span class="tree-entry"><span class=""><span><span class="sr-only">Directory</span><svg width="16" height="16" class="tree-icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M22.073 4.900L22.073 4.900L12.148 4.900L12.148 3.950Q12.148 3.125 11.585 2.563Q11.023 2 10.198 2L10.198 2L0.048 2L0.048 22L23.948 22L23.948 6.850Q23.998 6.025 23.448 5.462Q22.898 4.900 22.073 4.900Z"></path></svg></span>ui/
 </span></span></summary><ul><li class="file"><span class="tree-entry"><span class=""><span><svg width="16" height="16" class="tree-icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M1.082 16.876L1.082 14.014L22.918 14.014L22.918 16.876L1.082 16.876ZM1.082 9.986L1.082 7.071L13.272 7.071L13.272 9.986L1.082 9.986ZM1.082 3.096L1.082 0.181L22.918 0.181L22.918 3.096L1.082 3.096ZM1.082 23.819L1.082 20.904L17.300 20.904L17.300 23.819L1.082 23.819Z"></path></svg></span>app-window.slint</span> <span class="comment"> The <strong>main</strong> Slint file</span></span></li></ul></details></li><li class="file"><span class="tree-entry"><span class=""><span><svg width="16" height="16" class="tree-icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M18.419 2.539L18.419 2.983L18.419 3.686L18.530 3.797L18.642 3.797Q18.826 3.760 19.178 3.704Q19.529 3.649 19.696 3.575Q19.863 3.501 19.992 3.630Q20.122 3.760 20.047 3.926Q19.973 4.093 19.918 4.444Q19.863 4.796 19.825 4.981L19.825 4.981L19.825 5.092L19.936 5.203Q19.936 5.314 20.159 5.314L20.159 5.314L21.194 5.314Q21.564 5.314 21.527 5.647L21.527 5.647L21.527 5.906Q21.453 6.128 21.232 6.572L21.232 6.572L21.084 6.831L21.084 6.942L21.157 7.016Q21.194 7.090 21.194 7.164L21.194 7.164L21.305 7.164Q21.491 7.238 21.842 7.293Q22.194 7.349 22.360 7.367Q22.526 7.386 22.601 7.589Q22.674 7.793 22.601 7.978L22.601 7.978L22.305 8.385Q22.082 8.644 22.008 8.792L22.008 8.792L22.008 9.014Q22.008 9.088 22.119 9.162L22.119 9.162L22.230 9.236L23.155 9.606Q23.340 9.680 23.396 9.846Q23.451 10.013 23.267 10.161L23.267 10.161Q22.822 10.642 22.489 10.864L22.489 10.864L22.489 11.197L22.526 11.271Q22.637 11.308 22.712 11.308L22.712 11.308L22.970 11.493Q23.303 11.715 23.488 11.789Q23.674 11.863 23.674 12.066Q23.674 12.270 23.526 12.381L23.526 12.381L22.601 12.936L22.601 13.047Q22.601 13.232 22.601 13.269Q22.601 13.306 22.712 13.417L22.712 13.417Q23.155 13.861 23.415 13.972L23.415 13.972Q23.563 14.157 23.507 14.305Q23.451 14.453 23.267 14.564L23.267 14.564Q22.601 14.786 22.341 14.897L22.341 14.897L22.305 14.934Q22.230 14.971 22.194 15.045Q22.156 15.119 22.230 15.267L22.230 15.267L22.230 15.378Q22.415 15.526 22.637 15.933L22.637 15.933L22.822 16.192Q22.896 16.266 22.878 16.414Q22.860 16.562 22.712 16.636L22.712 16.636L22.601 16.673L22.453 16.747Q22.305 16.747 22.008 16.821Q21.712 16.895 21.564 16.895L21.564 16.895L21.416 16.895Q21.416 16.932 21.361 16.987Q21.305 17.043 21.305 17.117L21.305 17.117L21.343 17.228L21.416 17.339L21.787 18.153Q21.860 18.227 21.805 18.375Q21.749 18.523 21.675 18.597L21.675 18.597L20.270 18.597Q20.159 18.745 20.159 18.967L20.159 18.967Q20.232 19.115 20.288 19.411Q20.343 19.707 20.418 19.873Q20.491 20.040 20.343 20.188Q20.195 20.336 19.936 20.336L19.936 20.336Q19.752 20.299 19.400 20.243Q19.049 20.188 18.901 20.114L18.901 20.114L18.790 20.114L18.604 20.299Q18.567 20.336 18.642 20.336L18.642 20.336L18.642 21.372Q18.642 21.742 18.308 21.742L18.308 21.742L18.087 21.742Q17.605 21.594 17.162 21.261L17.162 21.261L17.050 21.261Q16.939 21.261 16.866 21.335Q16.791 21.409 16.791 21.520L16.791 21.520Q16.791 21.668 16.736 21.964Q16.680 22.260 16.680 22.426Q16.680 22.593 16.477 22.667Q16.273 22.741 16.125 22.667L16.125 22.667Q15.756 22.297 15.311 22.075L15.311 22.075L15.200 22.075Q15.090 22.075 15.015 22.149Q14.942 22.223 14.942 22.297L14.942 22.297L14.608 23.222Q14.497 23.481 14.276 23.481L14.276 23.481Q14.201 23.481 14.165 23.407L14.165 23.407L14.128 23.370Q13.683 22.889 13.462 22.556L13.462 22.556L13.203 22.556Q13.128 22.556 13.055 22.630Q12.980 22.704 12.980 22.778L12.980 22.778L12.537 23.592Q12.425 23.740 12.222 23.740Q12.018 23.740 11.945 23.592L11.945 23.592L11.352 22.667L11.020 22.667L10.206 23.481Q10.095 23.592 9.762 23.592L9.762 23.592Q9.651 23.592 9.651 23.370L9.651 23.370L9.280 22.260Q9.243 22.186 9.169 22.186L9.169 22.186L8.837 22.186Q8.651 22.371 8.281 22.593L8.281 22.593L8.023 22.778L7.800 22.667Q7.467 22.519 7.338 22.426Q7.208 22.334 7.208 22.186L7.208 22.186Q7.097 21.853 7.097 21.150L7.097 21.150L7.060 21.113Q7.060 21.039 6.986 21.039Q6.912 21.039 6.857 20.983Q6.801 20.928 6.764 20.928L6.764 20.928L6.616 20.928L6.505 21.039L5.691 21.372Q5.543 21.483 5.395 21.409Q5.247 21.335 5.247 21.150L5.247 21.150L5.247 19.892L5.136 19.781L5.026 19.781Q4.840 19.818 4.489 19.873Q4.138 19.929 3.971 20.003Q3.804 20.077 3.675 19.947Q3.545 19.818 3.619 19.651Q3.693 19.485 3.749 19.133Q3.804 18.782 3.841 18.597L3.841 18.597L3.841 18.486L3.731 18.375L2.583 18.375Q2.250 18.375 2.250 18.042L2.250 18.042L2.250 17.783Q2.324 17.561 2.583 17.117L2.583 17.117L2.694 16.858L2.694 16.710Q2.657 16.636 2.583 16.636L2.583 16.636Q2.583 16.562 2.510 16.562L2.510 16.562L2.472 16.525Q2.287 16.525 1.936 16.469Q1.584 16.414 1.418 16.414Q1.251 16.414 1.177 16.210Q1.103 16.007 1.214 15.822L1.214 15.822Q1.548 15.489 1.769 15.008L1.769 15.008L1.769 14.786L1.584 14.638Q1.510 14.564 1.436 14.564L1.436 14.564L0.622 14.231Q0.437 14.120 0.382 13.953Q0.326 13.787 0.511 13.639L0.511 13.639Q0.696 13.565 1.066 13.269L1.066 13.269Q1.288 13.047 1.436 12.936L1.436 12.936L1.436 12.714Q1.436 12.492 1.325 12.492L1.325 12.492L0.511 12.011Q0.326 11.937 0.326 11.733Q0.326 11.530 0.511 11.456L0.511 11.456L1.436 10.864L1.436 10.642L0.622 9.828Q0.548 9.754 0.548 9.606Q0.548 9.458 0.622 9.347L0.622 9.347L0.659 9.347Q0.733 9.310 0.733 9.236L0.733 9.236L1.769 8.903L1.769 8.792Q1.843 8.718 1.806 8.533L1.806 8.533L1.769 8.422Q1.658 8.311 1.492 8.089Q1.325 7.867 1.214 7.719Q1.103 7.571 1.177 7.367Q1.251 7.164 1.418 7.127Q1.584 7.090 1.936 7.034Q2.287 6.979 2.472 6.942L2.472 6.942L2.583 6.942Q2.583 6.868 2.639 6.812Q2.694 6.757 2.694 6.683L2.694 6.683L2.694 6.572L2.583 6.461L2.250 5.647Q2.139 5.499 2.213 5.351Q2.287 5.203 2.472 5.203L2.472 5.203L3.731 5.203L3.767 5.129Q3.767 5.092 3.841 5.092L3.841 5.092L3.841 4.981Q3.619 4.278 3.619 3.945L3.619 3.945Q3.545 3.760 3.675 3.630Q3.804 3.501 3.989 3.575L3.989 3.575Q4.322 3.575 5.026 3.797L5.026 3.797L5.136 3.797L5.284 3.649Q5.321 3.575 5.247 3.575L5.247 3.575L5.247 2.539Q5.247 2.206 5.580 2.206L5.580 2.206L5.840 2.206Q6.061 2.280 6.505 2.539L6.505 2.539L6.764 2.650L6.912 2.650Q6.986 2.613 6.986 2.539L6.986 2.539Q7.060 2.539 7.060 2.465L7.060 2.465L7.097 2.428Q7.097 2.243 7.153 1.891Q7.208 1.540 7.208 1.373Q7.208 1.207 7.412 1.133Q7.615 1.059 7.800 1.133L7.800 1.133Q8.133 1.503 8.614 1.725L8.614 1.725L8.837 1.725L8.947 1.614L8.947 1.540Q8.985 1.466 9.058 1.392L9.058 1.392L9.392 0.578Q9.503 0.430 9.576 0.393Q9.651 0.356 9.872 0.356L9.872 0.356L9.983 0.467Q10.058 0.652 10.354 1.022L10.354 1.022Q10.576 1.244 10.686 1.392L10.686 1.392L10.797 1.392Q10.872 1.392 10.945 1.318L10.945 1.318L11.020 1.281L11.500 0.467Q11.648 0.282 11.815 0.263Q11.982 0.245 12.055 0.356L12.055 0.356L12.166 0.467L12.759 1.392L13.091 1.392Q13.166 1.392 13.203 1.318L13.203 1.318L13.239 1.281Q13.683 0.800 13.794 0.578L13.794 0.578Q13.869 0.504 14.017 0.504Q14.165 0.504 14.276 0.578L14.276 0.578L14.276 0.689Q14.497 1.392 14.608 1.614L14.608 1.614L14.720 1.725L14.942 1.725Q15.459 1.540 15.866 1.133L15.866 1.133Q16.052 1.059 16.255 1.133Q16.459 1.207 16.459 1.373Q16.459 1.540 16.514 1.891Q16.569 2.243 16.569 2.428L16.569 2.428L16.607 2.465Q16.607 2.539 16.680 2.539L16.680 2.539L16.791 2.539Q16.902 2.613 16.976 2.613Q17.050 2.613 17.050 2.539L17.050 2.539Q17.273 2.428 17.976 2.206L17.976 2.206Q18.160 2.095 18.290 2.187Q18.419 2.280 18.419 2.539L18.419 2.539ZM5.580 6.128L5.580 6.128L14.386 6.128Q15.090 6.128 15.422 6.239L15.422 6.239Q16.532 6.609 17.050 7.275L17.050 7.275Q17.605 7.867 17.605 8.681L17.605 8.681Q17.605 9.347 17.273 10.050L17.273 10.050Q16.902 10.605 16.348 10.975L16.348 10.975Q16.125 11.197 15.977 11.197L15.977 11.197Q16.052 11.271 16.163 11.326Q16.273 11.382 16.348 11.456L16.348 11.456L16.532 11.604Q16.939 11.974 17.050 12.233L17.050 12.233Q17.383 12.788 17.383 13.417L17.383 13.417Q17.383 13.528 17.605 13.750L17.605 13.750Q17.753 13.898 18.049 13.972L18.049 13.972Q18.197 13.972 18.549 13.972Q18.901 13.972 19.122 13.750L19.122 13.750Q19.270 13.602 19.381 13.306L19.381 13.306L19.456 13.047L19.456 12.492Q19.456 12.381 19.474 12.381Q19.492 12.381 19.566 12.381L19.566 12.381L20.380 12.381L20.380 10.864Q20.232 10.790 19.881 10.623Q19.529 10.457 19.345 10.383L19.345 10.383Q19.308 10.346 19.122 10.290Q18.938 10.235 18.901 10.161L18.901 10.161Q18.346 9.976 18.530 9.236L18.530 9.236Q19.011 8.089 19.345 7.497L19.345 7.497L19.345 7.386Q18.901 6.683 18.642 6.387L18.642 6.387Q18.197 5.832 17.716 5.425L17.716 5.425Q16.014 3.871 13.573 3.353L13.573 3.353L13.462 3.353Q12.759 4.056 12.314 4.389L12.314 4.389Q12.130 4.574 11.834 4.574Q11.538 4.574 11.352 4.389L11.352 4.389L10.317 3.353L10.206 3.353Q9.762 3.464 9.058 3.686L9.058 3.686Q7.245 4.352 5.802 5.758L5.802 5.758Q5.580 6.017 5.580 6.128ZM18.642 16.747L18.642 16.747L15.200 16.747Q14.831 16.747 14.720 16.636L14.720 16.636Q14.128 16.340 13.905 15.489L13.905 15.489L13.869 15.267Q13.683 14.601 13.683 14.231L13.683 14.231Q13.683 13.972 13.480 13.528Q13.276 13.084 12.944 12.843Q12.610 12.603 12.166 12.603L12.166 12.603L10.095 12.603L10.095 14.083L12.166 14.083Q12.277 14.083 12.296 14.101Q12.314 14.120 12.314 14.231L12.314 14.231L12.314 16.525Q12.314 16.599 12.296 16.617Q12.277 16.636 12.166 16.636L12.166 16.636L5.247 16.636Q5.469 17.006 5.950 17.450L5.950 17.450L6.061 17.450Q6.986 17.228 7.430 17.228L7.430 17.228Q7.689 17.154 7.930 17.283Q8.171 17.413 8.244 17.672L8.244 17.672L8.614 19.189L8.614 19.300Q9.540 19.670 9.983 19.781L9.983 19.781Q10.761 20.003 11.352 20.003L11.352 20.003Q11.907 20.077 12.573 20.040L12.573 20.040Q12.980 20.003 13.794 19.892L13.794 19.892Q14.386 19.781 15.534 19.300L15.534 19.300L15.534 19.189L15.866 17.672Q16.088 17.080 16.680 17.228L16.680 17.228L18.087 17.561L18.197 17.561Q18.197 17.228 18.642 16.747ZM6.283 8.681L4.914 8.681L5.247 9.347L5.284 9.458Q5.321 9.643 5.247 9.717L5.247 9.717Q5.247 9.902 4.988 10.087L4.988 10.087L4.914 10.161Q3.989 10.642 3.508 10.753L3.508 10.753L3.434 10.753Q3.397 10.790 3.397 10.864L3.397 10.864L3.397 11.456Q3.397 12.603 3.731 13.972L3.731 13.972L3.767 14.046Q3.767 14.120 3.841 14.120L3.841 14.120L6.283 14.120L6.283 8.681ZM9.872 10.272L9.872 10.272Q9.910 10.272 9.947 10.272L9.947 10.272L9.872 10.272L12.537 10.272Q12.980 10.272 13.239 10.161L13.239 10.161L13.351 10.087Q13.498 9.976 13.573 9.809Q13.646 9.643 13.628 9.402Q13.610 9.162 13.462 9.014L13.462 9.014Q13.091 8.681 12.648 8.681L12.648 8.681L9.762 8.681Q9.872 9.236 9.872 10.272ZM2.917 9.125L2.917 9.125Q2.917 9.384 3.138 9.606Q3.360 9.828 3.619 9.828Q3.878 9.828 4.100 9.606Q4.322 9.384 4.322 9.125Q4.322 8.866 4.100 8.644Q3.878 8.422 3.619 8.422Q3.360 8.422 3.138 8.644Q2.917 8.866 2.917 9.125ZM17.605 18.856L17.605 18.856Q17.605 18.597 17.402 18.375Q17.198 18.153 16.921 18.153Q16.643 18.153 16.440 18.375Q16.236 18.597 16.236 18.856Q16.236 19.115 16.440 19.318Q16.643 19.522 16.921 19.522Q17.198 19.522 17.402 19.337Q17.605 19.152 17.605 18.856ZM6.764 18.153L6.764 18.153Q6.468 18.153 6.265 18.375Q6.061 18.597 6.061 18.856Q6.061 19.115 6.265 19.318Q6.468 19.522 6.746 19.522Q7.023 19.522 7.227 19.318Q7.430 19.115 7.430 18.856Q7.430 18.597 7.227 18.375Q7.023 18.153 6.764 18.153ZM12.537 2.983L12.537 2.983Q12.537 2.724 12.352 2.520Q12.166 2.317 11.852 2.317Q11.538 2.317 11.334 2.502Q11.131 2.687 11.131 2.983Q11.131 3.279 11.316 3.482Q11.500 3.686 11.834 3.686L11.834 3.686Q12.314 3.686 12.537 2.983ZM20.047 9.939L20.047 9.939Q20.306 9.939 20.529 9.717Q20.750 9.495 20.750 9.236Q20.750 8.977 20.529 8.755Q20.306 8.533 20.047 8.533Q19.788 8.533 19.566 8.755Q19.345 8.977 19.345 9.254Q19.345 9.532 19.529 9.735Q19.715 9.939 20.047 9.939Z"></path></svg></span>build.rs</span></span></li><li class="file"><span class="tree-entry"><span class=""><span><svg width="16" height="16" class="tree-icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M1.082 16.876L1.082 14.014L22.918 14.014L22.918 16.876L1.082 16.876ZM1.082 9.986L1.082 7.071L13.272 7.071L13.272 9.986L1.082 9.986ZM1.082 3.096L1.082 0.181L22.918 0.181L22.918 3.096L1.082 3.096ZM1.082 23.819L1.082 20.904L17.300 20.904L17.300 23.819L1.082 23.819Z"></path></svg></span>Cargo.Toml</span></span></li><li class="file"><span class="tree-entry"><span class=""><span><svg width="16" height="16" class="tree-icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M14.768 8.750L14.768 8.750Q14.636 7.067 13.431 5.994Q12.227 4.922 10.445 4.823L10.445 4.823L8.894 4.823Q8.795 3.602 9.356 2.710L9.356 2.710Q10.016 1.556 11.484 1.407Q12.953 1.259 13.943 2.248L13.943 2.248Q14.768 3.206 14.768 4.724L14.768 4.724Q14.768 5.021 14.900 5.152L14.900 5.152L15.824 6.076Q16.253 4.756 15.923 3.271L15.923 3.271Q15.527 1.919 14.454 1.093Q13.382 0.268 11.897 0.203L11.897 0.203Q10.940 0.203 10.280 0.401L10.280 0.401Q9.488 0.631 8.894 1.226L8.894 1.226Q8.168 1.919 7.821 3.041Q7.475 4.163 7.739 5.318L7.739 5.318Q8.036 6.572 8.993 7.495L8.993 7.495Q9.323 7.826 10.148 8.222L10.148 8.222Q10.511 8.387 10.791 8.172Q11.072 7.957 11.072 7.628L11.072 7.628Q11.072 6.934 10.346 6.803L10.346 6.803Q10.247 6.803 10.049 6.572L10.049 6.572L10.049 6.473Q10.346 6.407 10.692 6.489Q11.039 6.572 11.270 6.803L11.270 6.803Q11.732 7.265 11.567 8.024L11.567 8.024Q11.435 8.585 10.989 8.799Q10.544 9.014 9.917 8.849L9.917 8.849Q8.366 8.419 7.574 6.803L7.574 6.803Q7.508 6.637 7.359 6.324Q7.211 6.011 7.145 5.846L7.145 5.846Q6.518 6.506 6.188 6.968L6.188 6.968Q5.759 7.628 5.594 8.321L5.594 8.321Q5.000 11.093 7.046 12.974L7.046 12.974Q7.145 13.073 7.178 13.155Q7.211 13.238 7.145 13.403L7.145 13.403Q6.980 14.822 6.749 15.746L6.749 15.746Q6.584 16.637 6.320 18.336Q6.056 20.035 5.907 20.894Q5.759 21.752 5.924 22.577L5.924 22.577Q6.089 23.236 6.749 23.501L6.749 23.501Q6.782 23.303 6.831 22.890Q6.881 22.478 6.947 22.247L6.947 22.247Q7.112 21.389 7.359 19.689Q7.607 17.989 7.772 17.099L7.772 17.099Q7.871 16.571 8.019 15.498Q8.168 14.426 8.300 13.898L8.300 13.898Q8.300 13.601 8.597 13.601L8.597 13.601Q8.729 13.601 8.762 13.700Q8.795 13.799 8.795 13.997L8.795 13.997Q8.663 15.218 8.300 17.000L8.300 17.000Q8.135 18.089 7.805 20.102L7.805 20.102Q7.409 22.412 7.244 23.501L7.244 23.501Q7.244 23.567 7.310 23.633L7.310 23.633L7.343 23.699Q7.607 23.699 8.069 23.748Q8.531 23.797 8.795 23.797L8.795 23.797Q9.422 23.797 10.049 22.973L10.049 22.973Q10.478 22.544 10.148 21.851L10.148 21.851Q9.950 21.653 9.950 21.521L9.950 21.521Q9.488 20.927 10.148 20.597L10.148 20.597Q10.181 20.564 10.346 20.514Q10.511 20.465 10.544 20.399L10.544 20.399Q10.709 20.333 10.758 20.135Q10.808 19.937 10.643 19.772L10.643 19.772L10.346 19.474Q10.016 19.079 9.851 18.947Q9.686 18.815 9.735 18.567Q9.785 18.320 9.933 18.221Q10.082 18.122 10.445 17.973Q10.808 17.825 10.973 17.726Q11.138 17.627 11.171 17.495Q11.204 17.363 11.072 17.198L11.072 17.198Q10.874 17.000 10.742 16.802L10.742 16.802Q10.544 16.571 10.577 16.241Q10.610 15.911 10.841 15.729Q11.072 15.548 11.270 15.548L11.270 15.548Q11.567 15.416 11.600 15.152L11.600 15.152Q11.567 14.987 11.633 14.673Q11.699 14.360 11.699 14.228L11.699 14.228Q11.699 14.129 11.765 13.997Q11.831 13.865 11.897 13.799L11.897 13.799Q12.194 13.502 13.019 13.073L13.019 13.073Q14.075 12.314 14.504 11.208Q14.933 10.103 14.768 8.750ZM18.497 20.498L18.497 20.498Q18.497 20.102 18.068 20.102L18.068 20.102Q17.837 20.102 17.738 20.069L17.738 20.069Q17.540 20.003 17.474 19.772L17.474 19.772Q17.309 19.309 17.474 18.848L17.474 18.848Q17.804 18.188 17.045 18.023L17.045 18.023Q16.946 18.023 16.715 17.973Q16.484 17.924 16.319 17.924L16.319 17.924Q16.022 17.924 16.022 17.627L16.022 17.627Q16.022 17.528 15.972 17.313Q15.923 17.099 15.923 17.000L15.923 17.000Q15.923 16.802 16.055 16.604L16.055 16.604Q16.121 16.471 16.302 16.257Q16.484 16.043 16.467 15.927Q16.451 15.812 16.220 15.647L16.220 15.647Q16.187 15.614 16.022 15.515Q15.857 15.416 15.824 15.350L15.824 15.350Q15.527 15.185 15.477 15.020Q15.428 14.855 15.593 14.525L15.593 14.525Q15.824 14.327 15.824 14.228L15.824 14.228Q16.088 13.931 15.923 13.601L15.923 13.601L15.824 13.436Q15.659 13.040 15.494 12.875L15.494 12.875Q15.362 12.578 15.494 12.248L15.494 12.248Q16.814 9.640 15.824 7.198L15.824 7.198Q15.032 5.515 13.118 5.053L13.118 5.053L13.019 5.152Q13.085 5.186 13.184 5.351Q13.283 5.515 13.349 5.549L13.349 5.549Q15.296 7.198 15.296 9.575L15.296 9.575Q15.296 12.248 13.019 13.898L13.019 13.898Q12.854 13.997 12.804 14.129Q12.755 14.261 12.821 14.426L12.821 14.426Q13.019 14.921 13.382 15.911Q13.745 16.901 13.943 17.396L13.943 17.396L16.418 23.171L16.484 23.270Q16.583 23.402 16.748 23.402L16.748 23.402Q17.672 22.940 18.167 22.148Q18.662 21.356 18.497 20.498ZM12.293 14.426L12.293 14.426Q12.260 14.624 12.210 14.954Q12.161 15.284 12.095 15.449L12.095 15.449L12.062 15.647Q12.029 15.944 12.095 16.076L12.095 16.076L14.273 21.422Q14.636 22.346 15.296 22.873L15.296 22.873Q15.692 23.072 15.824 23.204L15.824 23.204L15.923 23.072Q14.768 20.201 12.293 14.426Z"></path></svg></span>LICENSE</span></span></li><li class="file"><span class="tree-entry"><span class=""><span><svg width="16" height="16" class="tree-icon" aria-hidden="true" viewBox="0 0 24 24"><path d="M23.780 10.803L23.818 10.803Q23.628 8.029 21.918 5.331L21.918 5.331Q20.664 3.469 18.916 2.234Q17.168 0.999 15.002 0.467L15.002 0.467Q13.748 0.125 12.646 0.125L12.646 0.125L10.746 0.125Q7.326 0.467 4.438 2.595L4.438 2.595Q1.132 5.369 0.296 9.245L0.296 9.245Q0.068 10.423 0.068 11.145L0.068 11.145L0.068 13.045Q0.448 16.351 2.082 18.631L2.082 18.631Q4.172 21.709 7.288 22.925L7.288 22.925Q9.454 23.685 11.202 23.875L11.202 23.875L13.102 23.875Q17.434 23.495 20.474 20.303L20.474 20.303Q22.944 17.833 23.666 14.375L23.666 14.375Q23.742 14.071 23.799 13.539Q23.856 13.007 23.932 12.703L23.932 12.703L23.932 11.411Q23.780 11.145 23.780 10.803L23.780 10.803ZM11.924 21.975L11.924 21.975Q9.188 21.975 6.870 20.569L6.870 20.569Q4.590 19.239 3.279 16.921Q1.968 14.603 1.968 11.867Q1.968 9.131 3.317 6.813Q4.666 4.495 6.984 3.165L6.984 3.165Q9.378 1.759 12.152 1.759L12.152 1.759Q14.850 1.835 17.149 3.184Q19.448 4.533 20.778 6.813L20.778 6.813Q22.146 9.131 22.108 11.867Q22.070 14.603 20.683 16.921Q19.296 19.239 17.016 20.569L17.016 20.569Q14.660 21.975 11.924 21.975ZM15.496 18.289L14.774 18.289Q14.432 18.289 14.166 18.175L14.166 18.175Q14.014 18.175 13.900 17.947L13.900 17.947Q13.862 17.833 13.824 17.795L13.824 17.795L13.824 10.081Q12.874 10.157 11.031 10.214Q9.188 10.271 8.238 10.309L8.238 10.309L8.238 11.259L9.416 11.259Q9.758 11.259 9.948 11.487Q10.138 11.715 10.138 12.095L10.138 12.095L10.138 17.567Q10.138 18.289 9.416 18.289L9.416 18.289L8.352 18.289L8.352 19.239L15.496 19.239L15.496 18.289ZM11.696 8.675L11.696 8.675Q12.570 8.675 13.140 8.067Q13.710 7.459 13.710 6.642Q13.710 5.825 13.102 5.217Q12.494 4.609 11.658 4.609Q10.822 4.609 10.252 5.217Q9.682 5.825 9.682 6.642Q9.682 7.459 10.290 8.067Q10.898 8.675 11.696 8.675Z"></path></svg></span>README.md</span></span></li></ul></starlight-file-tree>  </section> <starlight-tabs-restore class="astro-oqf2tref"></starlight-tabs-restore> </starlight-tabs>  
-<p>The <code dir="auto">src</code> folder is for the apps business logic. While the <code dir="auto">ui</code> folder contains the Slint files that define the user interface.</p> </div> <footer class="sl-flex astro-7fvjbusy"> <div class="meta sl-flex astro-7fvjbusy">   </div> <div class="pagination-links astro-s2mh7mvg" dir="ltr">  <a href="/tng/getting-started/which_language" rel="next" class="astro-s2mh7mvg"> <svg aria-hidden="true" class="astro-s2mh7mvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.5rem;"><path d="M17.92 11.62a1.001 1.001 0 0 0-.21-.33l-5-5a1.003 1.003 0 1 0-1.42 1.42l3.3 3.29H7a1 1 0 0 0 0 2h7.59l-3.3 3.29a1.002 1.002 0 0 0 .325 1.639 1 1 0 0 0 1.095-.219l5-5a1 1 0 0 0 .21-.33 1 1 0 0 0 0-.76Z"/></svg>  <span class="astro-s2mh7mvg"> Next <br class="astro-s2mh7mvg"> <span class="link-title astro-s2mh7mvg">Which language?</span> </span> </a> </div>   </footer>  </div> </div>   </main> </div> </div>  </div> </div>  </body></html>
\ No newline at end of file
+<p>The <code dir="auto">src</code> folder is for the apps business logic. While the <code dir="auto">ui</code> folder contains the Slint files that define the user interface.</p> </div> <footer class="sl-flex astro-7fvjbusy"> <div class="meta sl-flex astro-7fvjbusy">   </div> <div class="pagination-links astro-s2mh7mvg" dir="ltr"> <a href="/tng/overview" rel="prev" class="astro-s2mh7mvg"> <svg aria-hidden="true" class="astro-s2mh7mvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.5rem;"><path d="M17 11H9.41l3.3-3.29a1.004 1.004 0 1 0-1.42-1.42l-5 5a1 1 0 0 0-.21.33 1 1 0 0 0 0 .76 1 1 0 0 0 .21.33l5 5a1.002 1.002 0 0 0 1.639-.325 1 1 0 0 0-.219-1.095L9.41 13H17a1 1 0 0 0 0-2Z"/></svg>  <span class="astro-s2mh7mvg"> Previous <br class="astro-s2mh7mvg"> <span class="link-title astro-s2mh7mvg">Overview</span> </span> </a> <a href="/tng/getting-started/which_language" rel="next" class="astro-s2mh7mvg"> <svg aria-hidden="true" class="astro-s2mh7mvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.5rem;"><path d="M17.92 11.62a1.001 1.001 0 0 0-.21-.33l-5-5a1.003 1.003 0 1 0-1.42 1.42l3.3 3.29H7a1 1 0 0 0 0 2h7.59l-3.3 3.29a1.002 1.002 0 0 0 .325 1.639 1 1 0 0 0 1.095-.219l5-5a1 1 0 0 0 .21-.33 1 1 0 0 0 0-.76Z"/></svg>  <span class="astro-s2mh7mvg"> Next <br class="astro-s2mh7mvg"> <span class="link-title astro-s2mh7mvg">Which language?</span> </span> </a> </div>   </footer>  </div> </div>   </main> </div> </div>  </div> </div>  </body></html>
\ No newline at end of file
diff --git a/snapshots/tng/getting-started/which_language/index.html b/snapshots/tng/getting-started/which_language/index.html
index 872f72314..dc2f6a0e1 100644
--- a/snapshots/tng/getting-started/which_language/index.html
+++ b/snapshots/tng/getting-started/which_language/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/guide/animation/index.html b/snapshots/tng/guide/animation/index.html
index 1c8a256b6..b714d947a 100644
--- a/snapshots/tng/guide/animation/index.html
+++ b/snapshots/tng/guide/animation/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
@@ -81,8 +81,7 @@
 		})();
 	</script> </sl-sidebar-state-persist>  <div class="md:sl-hidden"> <div class="mobile-preferences sl-flex astro-qyfhjkv4"> <div class="sl-flex social-icons astro-qyfhjkv4"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">Animations</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <h1 id="animations">Animations</h1>
-<p>Declare animations for properties with the <code dir="auto">animate</code> keyword like this:</p>
+</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">Animations</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <p>Declare animations for properties with the <code dir="auto">animate</code> keyword like this:</p>
 <div class="expressive-code"><link rel="stylesheet" href="/tng/_astro/ec.x2uya.css"><script type="module" src="/tng/_astro/ec.8zarh.js"></script><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Example</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">preferred-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">100px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">preferred-height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">100px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code">
 </div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: area.pressed ? </span><span style="--0:#9CDCFE;--1:#001080">blue</span><span style="--0:#CCCCCC;--1:#3B3B3B"> : red;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#569CD6;--1:#0000FF">animate</span><span style="--0:#CCCCCC;--1:#3B3B3B"> background {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">duration</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">250ms</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code">
 </div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">area</span><span style="--0:#CCCCCC;--1:#3B3B3B"> := </span><span style="--0:#4EC9B0;--1:#227188">TouchArea</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="export component Example inherits Window {    preferred-width: 100px;    preferred-height: 100px;    background: area.pressed ? blue : red;    animate background {        duration: 250ms;    }    area := TouchArea {}}"><div></div></button></div></figure></div>
diff --git a/snapshots/tng/guide/basics/index.html b/snapshots/tng/guide/basics/index.html
index 588c1ddf5..e365a9b3c 100644
--- a/snapshots/tng/guide/basics/index.html
+++ b/snapshots/tng/guide/basics/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/guide/components/index.html b/snapshots/tng/guide/components/index.html
index f4b62914f..76be4ee22 100644
--- a/snapshots/tng/guide/components/index.html
+++ b/snapshots/tng/guide/components/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/guide/container/index.html b/snapshots/tng/guide/container/index.html
new file mode 100644
index 000000000..6bea84984
--- /dev/null
+++ b/snapshots/tng/guide/container/index.html
@@ -0,0 +1,95 @@
+<!DOCTYPE html><html lang="en" dir="ltr" data-has-toc data-has-sidebar data-theme="dark" class="astro-qk6vovz3"> <head><meta charset="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><title>Container Components | </title><link rel="canonical" href="https://snapshots.slint.dev/tng/guide/container/"/><link rel="sitemap" href="/tng/sitemap-index.xml"/><link rel="shortcut icon" href="/tng/favicon.svg" type="image/svg+xml"/><meta name="generator" content="Astro v4.16.10"/><meta name="generator" content="Starlight v0.28.6"/><meta property="og:title" content="Container Components"/><meta property="og:type" content="article"/><meta property="og:url" content="https://snapshots.slint.dev/tng/guide/container/"/><meta property="og:locale" content="en"/><meta property="og:description" content="Container Components"/><meta property="og:site_name" content=""/><meta name="twitter:card" content="summary_large_image"/><meta name="description" content="Container Components"/><script>
+	window.StarlightThemeProvider = (() => {
+		const storedTheme =
+			typeof localStorage !== 'undefined' && localStorage.getItem('starlight-theme');
+		const theme =
+			storedTheme ||
+			(window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark');
+		document.documentElement.dataset.theme = theme === 'light' ? 'light' : 'dark';
+		return {
+			updatePickers(theme = storedTheme || 'auto') {
+				document.querySelectorAll('starlight-theme-select').forEach((picker) => {
+					const select = picker.querySelector('select');
+					if (select) select.value = theme;
+					/** @type {HTMLTemplateElement | null} */
+					const tmpl = document.querySelector(`#theme-icons`);
+					const newIcon = tmpl && tmpl.content.querySelector('.' + theme);
+					if (newIcon) {
+						const oldIcon = picker.querySelector('svg.label-icon');
+						if (oldIcon) {
+							oldIcon.replaceChildren(...newIcon.cloneNode(true).childNodes);
+						}
+					}
+				});
+			},
+		};
+	})();
+</script><template id="theme-icons"><svg aria-hidden="true" class="light astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M5 12a1 1 0 0 0-1-1H3a1 1 0 0 0 0 2h1a1 1 0 0 0 1-1Zm.64 5-.71.71a1 1 0 0 0 0 1.41 1 1 0 0 0 1.41 0l.71-.71A1 1 0 0 0 5.64 17ZM12 5a1 1 0 0 0 1-1V3a1 1 0 0 0-2 0v1a1 1 0 0 0 1 1Zm5.66 2.34a1 1 0 0 0 .7-.29l.71-.71a1 1 0 1 0-1.41-1.41l-.66.71a1 1 0 0 0 0 1.41 1 1 0 0 0 .66.29Zm-12-.29a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.71-.71a1.004 1.004 0 1 0-1.43 1.41l.73.71ZM21 11h-1a1 1 0 0 0 0 2h1a1 1 0 0 0 0-2Zm-2.64 6A1 1 0 0 0 17 18.36l.71.71a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.76-.66ZM12 6.5a5.5 5.5 0 1 0 5.5 5.5A5.51 5.51 0 0 0 12 6.5Zm0 9a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7Zm0 3.5a1 1 0 0 0-1 1v1a1 1 0 0 0 2 0v-1a1 1 0 0 0-1-1Z"/></svg> <svg aria-hidden="true" class="dark astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.64 13a1 1 0 0 0-1.05-.14 8.049 8.049 0 0 1-3.37.73 8.15 8.15 0 0 1-8.14-8.1 8.59 8.59 0 0 1 .25-2A1 1 0 0 0 8 2.36a10.14 10.14 0 1 0 14 11.69 1 1 0 0 0-.36-1.05Zm-9.5 6.69A8.14 8.14 0 0 1 7.08 5.22v.27a10.15 10.15 0 0 0 10.14 10.14 9.784 9.784 0 0 0 2.1-.22 8.11 8.11 0 0 1-7.18 4.32v-.04Z"/></svg> <svg aria-hidden="true" class="auto astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg> </template><link rel="stylesheet" href="/tng/_astro/index.Dw8nZVol.css">
+<link rel="stylesheet" href="/tng/_astro/markdown.BIW0eA3J.css">
+<style>:root{--sl-badge-default-border: var(--sl-color-accent);--sl-badge-default-bg: var(--sl-color-accent-low);--sl-badge-default-text: #fff;--sl-badge-note-border: var(--sl-color-blue);--sl-badge-note-bg: var(--sl-color-blue-low);--sl-badge-note-text: #fff;--sl-badge-danger-border: var(--sl-color-red);--sl-badge-danger-bg: var(--sl-color-red-low);--sl-badge-danger-text: #fff;--sl-badge-success-border: var(--sl-color-green);--sl-badge-success-bg: var(--sl-color-green-low);--sl-badge-success-text: #fff;--sl-badge-caution-border: var(--sl-color-orange);--sl-badge-caution-bg: var(--sl-color-orange-low);--sl-badge-caution-text: #fff;--sl-badge-tip-border: var(--sl-color-purple);--sl-badge-tip-bg: var(--sl-color-purple-low);--sl-badge-tip-text: #fff}[data-theme=light]:root{--sl-badge-default-bg: var(--sl-color-accent-high);--sl-badge-note-bg: var(--sl-color-blue-high);--sl-badge-danger-bg: var(--sl-color-red-high);--sl-badge-success-bg: var(--sl-color-green-high);--sl-badge-caution-bg: var(--sl-color-orange-high);--sl-badge-tip-bg: var(--sl-color-purple-high)}.sl-badge:where(.astro-sudhlwkh){display:inline-block;border:1px solid var(--sl-color-border-badge);border-radius:.25rem;font-family:var(--sl-font-system-mono);line-height:normal;color:var(--sl-color-text-badge);background-color:var(--sl-color-bg-badge);overflow-wrap:anywhere}.sidebar-content .sl-badge:where(.astro-sudhlwkh){line-height:1;font-size:var(--sl-text-xs);padding:.125rem .375rem}.sidebar-content a[aria-current=page]>.sl-badge:where(.astro-sudhlwkh){--sl-color-bg-badge: transparent;--sl-color-border-badge: currentColor;color:inherit}.default:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-default-bg);--sl-color-border-badge: var(--sl-badge-default-border);--sl-color-text-badge: var(--sl-badge-default-text)}.note:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-note-bg);--sl-color-border-badge: var(--sl-badge-note-border);--sl-color-text-badge: var(--sl-badge-note-text)}.danger:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-danger-bg);--sl-color-border-badge: var(--sl-badge-danger-border);--sl-color-text-badge: var(--sl-badge-danger-text)}.success:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-success-bg);--sl-color-border-badge: var(--sl-badge-success-border);--sl-color-text-badge: var(--sl-badge-success-text)}.tip:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-tip-bg);--sl-color-border-badge: var(--sl-badge-tip-border);--sl-color-text-badge: var(--sl-badge-tip-text)}.caution:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-caution-bg);--sl-color-border-badge: var(--sl-badge-caution-border);--sl-color-text-badge: var(--sl-badge-caution-text)}.small:where(.astro-sudhlwkh){font-size:var(--sl-text-xs);padding:.125rem .25rem}.medium:where(.astro-sudhlwkh){font-size:var(--sl-text-sm);padding:.175rem .35rem}.large:where(.astro-sudhlwkh){font-size:var(--sl-text-base);padding:.225rem .45rem}.sl-markdown-content :is(h1,h2,h3,h4,h5,h6) .sl-badge:where(.astro-sudhlwkh){vertical-align:middle}
+.card-grid:where(.astro-q6zci5ae){display:grid;gap:1rem}.card-grid:where(.astro-q6zci5ae)>*{margin-top:0!important}@media (min-width: 50rem){.card-grid:where(.astro-q6zci5ae){grid-template-columns:1fr 1fr;gap:1.5rem}.stagger:where(.astro-q6zci5ae){--stagger-height: 5rem;padding-bottom:var(--stagger-height)}.stagger:where(.astro-q6zci5ae)>*:nth-child(2n){transform:translateY(var(--stagger-height))}}
+.card:where(.astro-pxlzet7z){--sl-card-border: var(--sl-color-purple);--sl-card-bg: var(--sl-color-purple-low);border:1px solid var(--sl-color-gray-5);background-color:var(--sl-color-black);padding:clamp(1rem,calc(.125rem + 3vw),2.5rem);flex-direction:column;gap:clamp(.5rem,calc(.125rem + 1vw),1rem)}.card:where(.astro-pxlzet7z):nth-child(4n+1){--sl-card-border: var(--sl-color-orange);--sl-card-bg: var(--sl-color-orange-low)}.card:where(.astro-pxlzet7z):nth-child(4n+3){--sl-card-border: var(--sl-color-green);--sl-card-bg: var(--sl-color-green-low)}.card:where(.astro-pxlzet7z):nth-child(4n+4){--sl-card-border: var(--sl-color-red);--sl-card-bg: var(--sl-color-red-low)}.card:where(.astro-pxlzet7z):nth-child(4n+5){--sl-card-border: var(--sl-color-blue);--sl-card-bg: var(--sl-color-blue-low)}.title:where(.astro-pxlzet7z){font-weight:600;font-size:var(--sl-text-h4);color:var(--sl-color-white);line-height:var(--sl-line-height-headings);gap:1rem;align-items:center}.card:where(.astro-pxlzet7z) .icon:where(.astro-pxlzet7z){border:1px solid var(--sl-card-border);background-color:var(--sl-card-bg);padding:.2em;border-radius:.25rem}.card:where(.astro-pxlzet7z) .body:where(.astro-pxlzet7z){margin:0;font-size:clamp(var(--sl-text-sm),calc(.5rem + 1vw),var(--sl-text-body))}
+svg:where(.astro-bncqquy7){color:var(--sl-icon-color);font-size:var(--sl-icon-size, 1em);width:1em;height:1em}
+starlight-tabs:where(.astro-oqf2tref){display:block}.tablist-wrapper:where(.astro-oqf2tref){overflow-x:auto}:where(.astro-oqf2tref)[role=tablist]{display:flex;list-style:none;border-bottom:2px solid var(--sl-color-gray-5);padding:0}.tab:where(.astro-oqf2tref){margin-bottom:-2px}.tab:where(.astro-oqf2tref)>:where(.astro-oqf2tref)[role=tab]{display:flex;align-items:center;gap:.5rem;padding:0 1.25rem;text-decoration:none;border-bottom:2px solid var(--sl-color-gray-5);color:var(--sl-color-gray-3);outline-offset:var(--sl-outline-offset-inside);overflow-wrap:initial}.tab:where(.astro-oqf2tref) :where(.astro-oqf2tref)[role=tab][aria-selected=true]{color:var(--sl-color-white);border-color:var(--sl-color-text-accent);font-weight:600}.tablist-wrapper:where(.astro-oqf2tref)~[role=tabpanel]{margin-top:1rem}
+.sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
+starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
+.sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
+<script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
+	(() => {
+		const openBtn = document.querySelector('button[data-open-modal]');
+		const shortcut = openBtn?.querySelector('kbd');
+		if (!openBtn || !(shortcut instanceof HTMLElement)) return;
+		const platformKey = shortcut.querySelector('kbd');
+		if (platformKey && /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform)) {
+			platformKey.textContent = '⌘';
+			openBtn.setAttribute('aria-keyshortcuts', 'Meta+K');
+		}
+		shortcut.style.display = '';
+	})();
+</script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
+		(() => {
+			try {
+				if (!matchMedia('(min-width: 50em)').matches) return;
+				/** @type {HTMLElement | null} */
+				const target = document.querySelector('sl-sidebar-state-persist');
+				const state = JSON.parse(sessionStorage.getItem('sl-sidebar-state') || '0');
+				if (!target || !state || target.dataset.hash !== state.hash) return;
+				window._starlightScrollRestore = state.scroll;
+				customElements.define(
+					'sl-sidebar-restore',
+					class SidebarRestore extends HTMLElement {
+						connectedCallback() {
+							try {
+								const idx = parseInt(this.dataset.index || '');
+								const details = this.closest('details');
+								if (details && typeof state.open[idx] === 'boolean') details.open = state.open[idx];
+							} catch {}
+						}
+					}
+				);
+			} catch {}
+		})();
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+		(() => {
+			const scroller = document.getElementById('starlight__sidebar');
+			if (!window._starlightScrollRestore || !scroller) return;
+			scroller.scrollTop = window._starlightScrollRestore;
+			delete window._starlightScrollRestore;
+		})();
+	</script> </sl-sidebar-state-persist>  <div class="md:sl-hidden"> <div class="mobile-preferences sl-flex astro-qyfhjkv4"> <div class="sl-flex social-icons astro-qyfhjkv4"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">Container Components</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <p>When creating components, it’s sometimes useful to influence where child
+elements are placed when used. For example, a component that draws
+a label above an element inside:</p>
+<div class="expressive-code"><link rel="stylesheet" href="/tng/_astro/ec.x2uya.css"><script type="module" src="/tng/_astro/ec.8zarh.js"></script><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint,ignore"><code><div class="ec-line"><div class="code"><span style="--0:#cccccc;--1:#3b3b3b">export component MyApp inherits Window {</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">BoxWithLabel {</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">        </span></span><span style="--0:#cccccc;--1:#3b3b3b">Text {</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">            </span></span><span style="--0:#cccccc;--1:#3b3b3b">// ...</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">        </span></span><span style="--0:#cccccc;--1:#3b3b3b">}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">}</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">// ...</span></div></div><div class="ec-line"><div class="code"><span style="--0:#cccccc;--1:#3b3b3b">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="export component MyApp inherits Window {    BoxWithLabel {        Text {            // ...        }    }    // ...}"><div></div></button></div></figure></div>
+<p>You can implement such a <code dir="auto">BoxWithLabel</code> using a layout. By default child elements like
+the <code dir="auto">Text</code> element become direct children of the <code dir="auto">BoxWithLabel</code>, but for this example they need to become
+children of the layout instead. To do this can change the default child placement by using
+the <code dir="auto">@children</code> expression inside the element hierarchy of a component:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">BoxWithLabel</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">GridLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">Row</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Text</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"label text here"</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">Row</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">@children</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">MyApp</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">preferred-height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">100px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">BoxWithLabel</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: yellow; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="component BoxWithLabel inherits GridLayout {    Row {        Text { text: &#x22;label text here&#x22;; }    }    Row {        @children    }}export component MyApp inherits Window {    preferred-height: 100px;    BoxWithLabel {        Rectangle { background: blue; }        Rectangle { background: yellow; }    }}"><div></div></button></div></figure></div> </div> <footer class="sl-flex astro-7fvjbusy"> <div class="meta sl-flex astro-7fvjbusy">   </div> <div class="pagination-links astro-s2mh7mvg" dir="ltr">   </div>   </footer>  </div> </div>   </main> </div> </div>  </div> </div>  </body></html>
\ No newline at end of file
diff --git a/snapshots/tng/guide/file/index.html b/snapshots/tng/guide/file/index.html
new file mode 100644
index 000000000..52739c06b
--- /dev/null
+++ b/snapshots/tng/guide/file/index.html
@@ -0,0 +1,111 @@
+<!DOCTYPE html><html lang="en" dir="ltr" data-has-toc data-has-sidebar data-theme="dark" class="astro-qk6vovz3"> <head><meta charset="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><title>The `.slint` File | </title><link rel="canonical" href="https://snapshots.slint.dev/tng/guide/file/"/><link rel="sitemap" href="/tng/sitemap-index.xml"/><link rel="shortcut icon" href="/tng/favicon.svg" type="image/svg+xml"/><meta name="generator" content="Astro v4.16.10"/><meta name="generator" content="Starlight v0.28.6"/><meta property="og:title" content="The `.slint` File"/><meta property="og:type" content="article"/><meta property="og:url" content="https://snapshots.slint.dev/tng/guide/file/"/><meta property="og:locale" content="en"/><meta property="og:description" content="The `.slint` File"/><meta property="og:site_name" content=""/><meta name="twitter:card" content="summary_large_image"/><meta name="description" content="The `.slint` File"/><script>
+	window.StarlightThemeProvider = (() => {
+		const storedTheme =
+			typeof localStorage !== 'undefined' && localStorage.getItem('starlight-theme');
+		const theme =
+			storedTheme ||
+			(window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark');
+		document.documentElement.dataset.theme = theme === 'light' ? 'light' : 'dark';
+		return {
+			updatePickers(theme = storedTheme || 'auto') {
+				document.querySelectorAll('starlight-theme-select').forEach((picker) => {
+					const select = picker.querySelector('select');
+					if (select) select.value = theme;
+					/** @type {HTMLTemplateElement | null} */
+					const tmpl = document.querySelector(`#theme-icons`);
+					const newIcon = tmpl && tmpl.content.querySelector('.' + theme);
+					if (newIcon) {
+						const oldIcon = picker.querySelector('svg.label-icon');
+						if (oldIcon) {
+							oldIcon.replaceChildren(...newIcon.cloneNode(true).childNodes);
+						}
+					}
+				});
+			},
+		};
+	})();
+</script><template id="theme-icons"><svg aria-hidden="true" class="light astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M5 12a1 1 0 0 0-1-1H3a1 1 0 0 0 0 2h1a1 1 0 0 0 1-1Zm.64 5-.71.71a1 1 0 0 0 0 1.41 1 1 0 0 0 1.41 0l.71-.71A1 1 0 0 0 5.64 17ZM12 5a1 1 0 0 0 1-1V3a1 1 0 0 0-2 0v1a1 1 0 0 0 1 1Zm5.66 2.34a1 1 0 0 0 .7-.29l.71-.71a1 1 0 1 0-1.41-1.41l-.66.71a1 1 0 0 0 0 1.41 1 1 0 0 0 .66.29Zm-12-.29a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.71-.71a1.004 1.004 0 1 0-1.43 1.41l.73.71ZM21 11h-1a1 1 0 0 0 0 2h1a1 1 0 0 0 0-2Zm-2.64 6A1 1 0 0 0 17 18.36l.71.71a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.76-.66ZM12 6.5a5.5 5.5 0 1 0 5.5 5.5A5.51 5.51 0 0 0 12 6.5Zm0 9a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7Zm0 3.5a1 1 0 0 0-1 1v1a1 1 0 0 0 2 0v-1a1 1 0 0 0-1-1Z"/></svg> <svg aria-hidden="true" class="dark astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.64 13a1 1 0 0 0-1.05-.14 8.049 8.049 0 0 1-3.37.73 8.15 8.15 0 0 1-8.14-8.1 8.59 8.59 0 0 1 .25-2A1 1 0 0 0 8 2.36a10.14 10.14 0 1 0 14 11.69 1 1 0 0 0-.36-1.05Zm-9.5 6.69A8.14 8.14 0 0 1 7.08 5.22v.27a10.15 10.15 0 0 0 10.14 10.14 9.784 9.784 0 0 0 2.1-.22 8.11 8.11 0 0 1-7.18 4.32v-.04Z"/></svg> <svg aria-hidden="true" class="auto astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg> </template><link rel="stylesheet" href="/tng/_astro/index.Dw8nZVol.css">
+<link rel="stylesheet" href="/tng/_astro/markdown.BIW0eA3J.css">
+<style>:root{--sl-badge-default-border: var(--sl-color-accent);--sl-badge-default-bg: var(--sl-color-accent-low);--sl-badge-default-text: #fff;--sl-badge-note-border: var(--sl-color-blue);--sl-badge-note-bg: var(--sl-color-blue-low);--sl-badge-note-text: #fff;--sl-badge-danger-border: var(--sl-color-red);--sl-badge-danger-bg: var(--sl-color-red-low);--sl-badge-danger-text: #fff;--sl-badge-success-border: var(--sl-color-green);--sl-badge-success-bg: var(--sl-color-green-low);--sl-badge-success-text: #fff;--sl-badge-caution-border: var(--sl-color-orange);--sl-badge-caution-bg: var(--sl-color-orange-low);--sl-badge-caution-text: #fff;--sl-badge-tip-border: var(--sl-color-purple);--sl-badge-tip-bg: var(--sl-color-purple-low);--sl-badge-tip-text: #fff}[data-theme=light]:root{--sl-badge-default-bg: var(--sl-color-accent-high);--sl-badge-note-bg: var(--sl-color-blue-high);--sl-badge-danger-bg: var(--sl-color-red-high);--sl-badge-success-bg: var(--sl-color-green-high);--sl-badge-caution-bg: var(--sl-color-orange-high);--sl-badge-tip-bg: var(--sl-color-purple-high)}.sl-badge:where(.astro-sudhlwkh){display:inline-block;border:1px solid var(--sl-color-border-badge);border-radius:.25rem;font-family:var(--sl-font-system-mono);line-height:normal;color:var(--sl-color-text-badge);background-color:var(--sl-color-bg-badge);overflow-wrap:anywhere}.sidebar-content .sl-badge:where(.astro-sudhlwkh){line-height:1;font-size:var(--sl-text-xs);padding:.125rem .375rem}.sidebar-content a[aria-current=page]>.sl-badge:where(.astro-sudhlwkh){--sl-color-bg-badge: transparent;--sl-color-border-badge: currentColor;color:inherit}.default:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-default-bg);--sl-color-border-badge: var(--sl-badge-default-border);--sl-color-text-badge: var(--sl-badge-default-text)}.note:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-note-bg);--sl-color-border-badge: var(--sl-badge-note-border);--sl-color-text-badge: var(--sl-badge-note-text)}.danger:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-danger-bg);--sl-color-border-badge: var(--sl-badge-danger-border);--sl-color-text-badge: var(--sl-badge-danger-text)}.success:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-success-bg);--sl-color-border-badge: var(--sl-badge-success-border);--sl-color-text-badge: var(--sl-badge-success-text)}.tip:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-tip-bg);--sl-color-border-badge: var(--sl-badge-tip-border);--sl-color-text-badge: var(--sl-badge-tip-text)}.caution:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-caution-bg);--sl-color-border-badge: var(--sl-badge-caution-border);--sl-color-text-badge: var(--sl-badge-caution-text)}.small:where(.astro-sudhlwkh){font-size:var(--sl-text-xs);padding:.125rem .25rem}.medium:where(.astro-sudhlwkh){font-size:var(--sl-text-sm);padding:.175rem .35rem}.large:where(.astro-sudhlwkh){font-size:var(--sl-text-base);padding:.225rem .45rem}.sl-markdown-content :is(h1,h2,h3,h4,h5,h6) .sl-badge:where(.astro-sudhlwkh){vertical-align:middle}
+.card-grid:where(.astro-q6zci5ae){display:grid;gap:1rem}.card-grid:where(.astro-q6zci5ae)>*{margin-top:0!important}@media (min-width: 50rem){.card-grid:where(.astro-q6zci5ae){grid-template-columns:1fr 1fr;gap:1.5rem}.stagger:where(.astro-q6zci5ae){--stagger-height: 5rem;padding-bottom:var(--stagger-height)}.stagger:where(.astro-q6zci5ae)>*:nth-child(2n){transform:translateY(var(--stagger-height))}}
+.card:where(.astro-pxlzet7z){--sl-card-border: var(--sl-color-purple);--sl-card-bg: var(--sl-color-purple-low);border:1px solid var(--sl-color-gray-5);background-color:var(--sl-color-black);padding:clamp(1rem,calc(.125rem + 3vw),2.5rem);flex-direction:column;gap:clamp(.5rem,calc(.125rem + 1vw),1rem)}.card:where(.astro-pxlzet7z):nth-child(4n+1){--sl-card-border: var(--sl-color-orange);--sl-card-bg: var(--sl-color-orange-low)}.card:where(.astro-pxlzet7z):nth-child(4n+3){--sl-card-border: var(--sl-color-green);--sl-card-bg: var(--sl-color-green-low)}.card:where(.astro-pxlzet7z):nth-child(4n+4){--sl-card-border: var(--sl-color-red);--sl-card-bg: var(--sl-color-red-low)}.card:where(.astro-pxlzet7z):nth-child(4n+5){--sl-card-border: var(--sl-color-blue);--sl-card-bg: var(--sl-color-blue-low)}.title:where(.astro-pxlzet7z){font-weight:600;font-size:var(--sl-text-h4);color:var(--sl-color-white);line-height:var(--sl-line-height-headings);gap:1rem;align-items:center}.card:where(.astro-pxlzet7z) .icon:where(.astro-pxlzet7z){border:1px solid var(--sl-card-border);background-color:var(--sl-card-bg);padding:.2em;border-radius:.25rem}.card:where(.astro-pxlzet7z) .body:where(.astro-pxlzet7z){margin:0;font-size:clamp(var(--sl-text-sm),calc(.5rem + 1vw),var(--sl-text-body))}
+svg:where(.astro-bncqquy7){color:var(--sl-icon-color);font-size:var(--sl-icon-size, 1em);width:1em;height:1em}
+starlight-tabs:where(.astro-oqf2tref){display:block}.tablist-wrapper:where(.astro-oqf2tref){overflow-x:auto}:where(.astro-oqf2tref)[role=tablist]{display:flex;list-style:none;border-bottom:2px solid var(--sl-color-gray-5);padding:0}.tab:where(.astro-oqf2tref){margin-bottom:-2px}.tab:where(.astro-oqf2tref)>:where(.astro-oqf2tref)[role=tab]{display:flex;align-items:center;gap:.5rem;padding:0 1.25rem;text-decoration:none;border-bottom:2px solid var(--sl-color-gray-5);color:var(--sl-color-gray-3);outline-offset:var(--sl-outline-offset-inside);overflow-wrap:initial}.tab:where(.astro-oqf2tref) :where(.astro-oqf2tref)[role=tab][aria-selected=true]{color:var(--sl-color-white);border-color:var(--sl-color-text-accent);font-weight:600}.tablist-wrapper:where(.astro-oqf2tref)~[role=tabpanel]{margin-top:1rem}
+.sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
+starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
+.sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
+<script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
+	(() => {
+		const openBtn = document.querySelector('button[data-open-modal]');
+		const shortcut = openBtn?.querySelector('kbd');
+		if (!openBtn || !(shortcut instanceof HTMLElement)) return;
+		const platformKey = shortcut.querySelector('kbd');
+		if (platformKey && /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform)) {
+			platformKey.textContent = '⌘';
+			openBtn.setAttribute('aria-keyshortcuts', 'Meta+K');
+		}
+		shortcut.style.display = '';
+	})();
+</script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
+		(() => {
+			try {
+				if (!matchMedia('(min-width: 50em)').matches) return;
+				/** @type {HTMLElement | null} */
+				const target = document.querySelector('sl-sidebar-state-persist');
+				const state = JSON.parse(sessionStorage.getItem('sl-sidebar-state') || '0');
+				if (!target || !state || target.dataset.hash !== state.hash) return;
+				window._starlightScrollRestore = state.scroll;
+				customElements.define(
+					'sl-sidebar-restore',
+					class SidebarRestore extends HTMLElement {
+						connectedCallback() {
+							try {
+								const idx = parseInt(this.dataset.index || '');
+								const details = this.closest('details');
+								if (details && typeof state.open[idx] === 'boolean') details.open = state.open[idx];
+							} catch {}
+						}
+					}
+				);
+			} catch {}
+		})();
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+		(() => {
+			const scroller = document.getElementById('starlight__sidebar');
+			if (!window._starlightScrollRestore || !scroller) return;
+			scroller.scrollTop = window._starlightScrollRestore;
+			delete window._starlightScrollRestore;
+		})();
+	</script> </sl-sidebar-state-persist>  <div class="md:sl-hidden"> <div class="mobile-preferences sl-flex astro-qyfhjkv4"> <div class="sl-flex social-icons astro-qyfhjkv4"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">The `.slint` File</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <p>You write user interfaces in the Slint language and saved in files with the <code dir="auto">.slint</code> extension.</p>
+<p>Each <code dir="auto">.slint</code> file defines one or several components. These components declare
+a tree of elements. Components form the basis of composition in Slint. Use them
+to build your own re-usable set of UI controls. You can use each declared
+component under its name as an element in another component.</p>
+<p>Below is an example of components and elements:</p>
+<div class="expressive-code"><link rel="stylesheet" href="/tng/_astro/ec.x2uya.css"><script type="module" src="/tng/_astro/ec.8zarh.js"></script><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">MyButton</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Text</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">color</span><span style="--0:#CCCCCC;--1:#3B3B3B">: black;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#76A162;--1:#007A00">// ...</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">MyApp</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">preferred-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">preferred-height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">100px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">100px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: green;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">MyButton</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">x</span><span style="--0:#CCCCCC;--1:#3B3B3B">:</span><span style="--0:#B5CEA8;--1:#08774E">0</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span><span style="--0:#9CDCFE;--1:#001080">y</span><span style="--0:#CCCCCC;--1:#3B3B3B">:</span><span style="--0:#B5CEA8;--1:#08774E">0</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"hello"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">MyButton</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">y</span><span style="--0:#CCCCCC;--1:#3B3B3B">:</span><span style="--0:#B5CEA8;--1:#08774E">0</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">x</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">50px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"world"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="component MyButton inherits Text {    color: black;    // ...}export component MyApp inherits Window {    preferred-width: 200px;    preferred-height: 100px;    Rectangle {        width: 200px;        height: 100px;        background: green;    }    MyButton {        x:0;y:0;        text: &#x22;hello&#x22;;    }    MyButton {        y:0;        x: 50px;        text: &#x22;world&#x22;;    }}"><div></div></button></div></figure></div>
+<p>Both <code dir="auto">MyButton</code> and <code dir="auto">MyApp</code> are components. <code dir="auto">Window</code> and <code dir="auto">Rectangle</code> are built-in elements
+used by <code dir="auto">MyApp</code>. <code dir="auto">MyApp</code> also re-uses the <code dir="auto">MyButton</code> component as two separate elements.</p>
+<p>Elements have properties, which you can assign values to. The example above assigns a string
+constant “hello” to the first <code dir="auto">MyButton</code>’s <code dir="auto">text</code> property. You
+can also assign entire expressions. Slint re-evaluates the expressions when any
+of the properties they depend on change, which makes the user-interface reactive.</p>
+<p>You can name elements using the <code dir="auto">:=</code> syntax:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">MyButton</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Text</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#76A162;--1:#007A00">// ...</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">MyApp</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">preferred-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">preferred-height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">100px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">hello</span><span style="--0:#CCCCCC;--1:#3B3B3B"> := </span><span style="--0:#4EC9B0;--1:#227188">MyButton</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">x</span><span style="--0:#CCCCCC;--1:#3B3B3B">:</span><span style="--0:#B5CEA8;--1:#08774E">0</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span><span style="--0:#9CDCFE;--1:#001080">y</span><span style="--0:#CCCCCC;--1:#3B3B3B">:</span><span style="--0:#B5CEA8;--1:#08774E">0</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"hello"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">world</span><span style="--0:#CCCCCC;--1:#3B3B3B"> := </span><span style="--0:#4EC9B0;--1:#227188">MyButton</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">y</span><span style="--0:#CCCCCC;--1:#3B3B3B">:</span><span style="--0:#B5CEA8;--1:#08774E">0</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"world"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">x</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">50px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="component MyButton inherits Text {    // ...}export component MyApp inherits Window {    preferred-width: 200px;    preferred-height: 100px;    hello := MyButton {        x:0;y:0;        text: &#x22;hello&#x22;;    }    world := MyButton {        y:0;        text: &#x22;world&#x22;;        x: 50px;    }}"><div></div></button></div></figure></div>
+<p>:::{note}</p>
+<p>Names have to be valid <a href="../syntax/identifiers.md">identifiers</a>.</p>
+<p>:::</p>
+<p>Some elements are also accessible under pre-defined names:</p>
+<ul>
+<li><code dir="auto">root</code> refers to the outermost element of a component.</li>
+<li><code dir="auto">self</code> refers to the current element.</li>
+<li><code dir="auto">parent</code> refers to the parent element of the current element.</li>
+</ul>
+<p>These names are reserved and you can’t re-define them.</p> </div> <footer class="sl-flex astro-7fvjbusy"> <div class="meta sl-flex astro-7fvjbusy">   </div> <div class="pagination-links astro-s2mh7mvg" dir="ltr">   </div>   </footer>  </div> </div>   </main> </div> </div>  </div> </div>  </body></html>
\ No newline at end of file
diff --git a/snapshots/tng/guide/focus/index.html b/snapshots/tng/guide/focus/index.html
new file mode 100644
index 000000000..c677f7186
--- /dev/null
+++ b/snapshots/tng/guide/focus/index.html
@@ -0,0 +1,103 @@
+<!DOCTYPE html><html lang="en" dir="ltr" data-has-toc data-has-sidebar data-theme="dark" class="astro-qk6vovz3"> <head><meta charset="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><title>Focus Handling | </title><link rel="canonical" href="https://snapshots.slint.dev/tng/guide/focus/"/><link rel="sitemap" href="/tng/sitemap-index.xml"/><link rel="shortcut icon" href="/tng/favicon.svg" type="image/svg+xml"/><meta name="generator" content="Astro v4.16.10"/><meta name="generator" content="Starlight v0.28.6"/><meta property="og:title" content="Focus Handling"/><meta property="og:type" content="article"/><meta property="og:url" content="https://snapshots.slint.dev/tng/guide/focus/"/><meta property="og:locale" content="en"/><meta property="og:description" content="Focus Handling"/><meta property="og:site_name" content=""/><meta name="twitter:card" content="summary_large_image"/><meta name="description" content="Focus Handling"/><script>
+	window.StarlightThemeProvider = (() => {
+		const storedTheme =
+			typeof localStorage !== 'undefined' && localStorage.getItem('starlight-theme');
+		const theme =
+			storedTheme ||
+			(window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark');
+		document.documentElement.dataset.theme = theme === 'light' ? 'light' : 'dark';
+		return {
+			updatePickers(theme = storedTheme || 'auto') {
+				document.querySelectorAll('starlight-theme-select').forEach((picker) => {
+					const select = picker.querySelector('select');
+					if (select) select.value = theme;
+					/** @type {HTMLTemplateElement | null} */
+					const tmpl = document.querySelector(`#theme-icons`);
+					const newIcon = tmpl && tmpl.content.querySelector('.' + theme);
+					if (newIcon) {
+						const oldIcon = picker.querySelector('svg.label-icon');
+						if (oldIcon) {
+							oldIcon.replaceChildren(...newIcon.cloneNode(true).childNodes);
+						}
+					}
+				});
+			},
+		};
+	})();
+</script><template id="theme-icons"><svg aria-hidden="true" class="light astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M5 12a1 1 0 0 0-1-1H3a1 1 0 0 0 0 2h1a1 1 0 0 0 1-1Zm.64 5-.71.71a1 1 0 0 0 0 1.41 1 1 0 0 0 1.41 0l.71-.71A1 1 0 0 0 5.64 17ZM12 5a1 1 0 0 0 1-1V3a1 1 0 0 0-2 0v1a1 1 0 0 0 1 1Zm5.66 2.34a1 1 0 0 0 .7-.29l.71-.71a1 1 0 1 0-1.41-1.41l-.66.71a1 1 0 0 0 0 1.41 1 1 0 0 0 .66.29Zm-12-.29a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.71-.71a1.004 1.004 0 1 0-1.43 1.41l.73.71ZM21 11h-1a1 1 0 0 0 0 2h1a1 1 0 0 0 0-2Zm-2.64 6A1 1 0 0 0 17 18.36l.71.71a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.76-.66ZM12 6.5a5.5 5.5 0 1 0 5.5 5.5A5.51 5.51 0 0 0 12 6.5Zm0 9a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7Zm0 3.5a1 1 0 0 0-1 1v1a1 1 0 0 0 2 0v-1a1 1 0 0 0-1-1Z"/></svg> <svg aria-hidden="true" class="dark astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.64 13a1 1 0 0 0-1.05-.14 8.049 8.049 0 0 1-3.37.73 8.15 8.15 0 0 1-8.14-8.1 8.59 8.59 0 0 1 .25-2A1 1 0 0 0 8 2.36a10.14 10.14 0 1 0 14 11.69 1 1 0 0 0-.36-1.05Zm-9.5 6.69A8.14 8.14 0 0 1 7.08 5.22v.27a10.15 10.15 0 0 0 10.14 10.14 9.784 9.784 0 0 0 2.1-.22 8.11 8.11 0 0 1-7.18 4.32v-.04Z"/></svg> <svg aria-hidden="true" class="auto astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg> </template><link rel="stylesheet" href="/tng/_astro/index.Dw8nZVol.css">
+<link rel="stylesheet" href="/tng/_astro/markdown.BIW0eA3J.css">
+<style>:root{--sl-badge-default-border: var(--sl-color-accent);--sl-badge-default-bg: var(--sl-color-accent-low);--sl-badge-default-text: #fff;--sl-badge-note-border: var(--sl-color-blue);--sl-badge-note-bg: var(--sl-color-blue-low);--sl-badge-note-text: #fff;--sl-badge-danger-border: var(--sl-color-red);--sl-badge-danger-bg: var(--sl-color-red-low);--sl-badge-danger-text: #fff;--sl-badge-success-border: var(--sl-color-green);--sl-badge-success-bg: var(--sl-color-green-low);--sl-badge-success-text: #fff;--sl-badge-caution-border: var(--sl-color-orange);--sl-badge-caution-bg: var(--sl-color-orange-low);--sl-badge-caution-text: #fff;--sl-badge-tip-border: var(--sl-color-purple);--sl-badge-tip-bg: var(--sl-color-purple-low);--sl-badge-tip-text: #fff}[data-theme=light]:root{--sl-badge-default-bg: var(--sl-color-accent-high);--sl-badge-note-bg: var(--sl-color-blue-high);--sl-badge-danger-bg: var(--sl-color-red-high);--sl-badge-success-bg: var(--sl-color-green-high);--sl-badge-caution-bg: var(--sl-color-orange-high);--sl-badge-tip-bg: var(--sl-color-purple-high)}.sl-badge:where(.astro-sudhlwkh){display:inline-block;border:1px solid var(--sl-color-border-badge);border-radius:.25rem;font-family:var(--sl-font-system-mono);line-height:normal;color:var(--sl-color-text-badge);background-color:var(--sl-color-bg-badge);overflow-wrap:anywhere}.sidebar-content .sl-badge:where(.astro-sudhlwkh){line-height:1;font-size:var(--sl-text-xs);padding:.125rem .375rem}.sidebar-content a[aria-current=page]>.sl-badge:where(.astro-sudhlwkh){--sl-color-bg-badge: transparent;--sl-color-border-badge: currentColor;color:inherit}.default:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-default-bg);--sl-color-border-badge: var(--sl-badge-default-border);--sl-color-text-badge: var(--sl-badge-default-text)}.note:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-note-bg);--sl-color-border-badge: var(--sl-badge-note-border);--sl-color-text-badge: var(--sl-badge-note-text)}.danger:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-danger-bg);--sl-color-border-badge: var(--sl-badge-danger-border);--sl-color-text-badge: var(--sl-badge-danger-text)}.success:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-success-bg);--sl-color-border-badge: var(--sl-badge-success-border);--sl-color-text-badge: var(--sl-badge-success-text)}.tip:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-tip-bg);--sl-color-border-badge: var(--sl-badge-tip-border);--sl-color-text-badge: var(--sl-badge-tip-text)}.caution:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-caution-bg);--sl-color-border-badge: var(--sl-badge-caution-border);--sl-color-text-badge: var(--sl-badge-caution-text)}.small:where(.astro-sudhlwkh){font-size:var(--sl-text-xs);padding:.125rem .25rem}.medium:where(.astro-sudhlwkh){font-size:var(--sl-text-sm);padding:.175rem .35rem}.large:where(.astro-sudhlwkh){font-size:var(--sl-text-base);padding:.225rem .45rem}.sl-markdown-content :is(h1,h2,h3,h4,h5,h6) .sl-badge:where(.astro-sudhlwkh){vertical-align:middle}
+.card-grid:where(.astro-q6zci5ae){display:grid;gap:1rem}.card-grid:where(.astro-q6zci5ae)>*{margin-top:0!important}@media (min-width: 50rem){.card-grid:where(.astro-q6zci5ae){grid-template-columns:1fr 1fr;gap:1.5rem}.stagger:where(.astro-q6zci5ae){--stagger-height: 5rem;padding-bottom:var(--stagger-height)}.stagger:where(.astro-q6zci5ae)>*:nth-child(2n){transform:translateY(var(--stagger-height))}}
+.card:where(.astro-pxlzet7z){--sl-card-border: var(--sl-color-purple);--sl-card-bg: var(--sl-color-purple-low);border:1px solid var(--sl-color-gray-5);background-color:var(--sl-color-black);padding:clamp(1rem,calc(.125rem + 3vw),2.5rem);flex-direction:column;gap:clamp(.5rem,calc(.125rem + 1vw),1rem)}.card:where(.astro-pxlzet7z):nth-child(4n+1){--sl-card-border: var(--sl-color-orange);--sl-card-bg: var(--sl-color-orange-low)}.card:where(.astro-pxlzet7z):nth-child(4n+3){--sl-card-border: var(--sl-color-green);--sl-card-bg: var(--sl-color-green-low)}.card:where(.astro-pxlzet7z):nth-child(4n+4){--sl-card-border: var(--sl-color-red);--sl-card-bg: var(--sl-color-red-low)}.card:where(.astro-pxlzet7z):nth-child(4n+5){--sl-card-border: var(--sl-color-blue);--sl-card-bg: var(--sl-color-blue-low)}.title:where(.astro-pxlzet7z){font-weight:600;font-size:var(--sl-text-h4);color:var(--sl-color-white);line-height:var(--sl-line-height-headings);gap:1rem;align-items:center}.card:where(.astro-pxlzet7z) .icon:where(.astro-pxlzet7z){border:1px solid var(--sl-card-border);background-color:var(--sl-card-bg);padding:.2em;border-radius:.25rem}.card:where(.astro-pxlzet7z) .body:where(.astro-pxlzet7z){margin:0;font-size:clamp(var(--sl-text-sm),calc(.5rem + 1vw),var(--sl-text-body))}
+svg:where(.astro-bncqquy7){color:var(--sl-icon-color);font-size:var(--sl-icon-size, 1em);width:1em;height:1em}
+starlight-tabs:where(.astro-oqf2tref){display:block}.tablist-wrapper:where(.astro-oqf2tref){overflow-x:auto}:where(.astro-oqf2tref)[role=tablist]{display:flex;list-style:none;border-bottom:2px solid var(--sl-color-gray-5);padding:0}.tab:where(.astro-oqf2tref){margin-bottom:-2px}.tab:where(.astro-oqf2tref)>:where(.astro-oqf2tref)[role=tab]{display:flex;align-items:center;gap:.5rem;padding:0 1.25rem;text-decoration:none;border-bottom:2px solid var(--sl-color-gray-5);color:var(--sl-color-gray-3);outline-offset:var(--sl-outline-offset-inside);overflow-wrap:initial}.tab:where(.astro-oqf2tref) :where(.astro-oqf2tref)[role=tab][aria-selected=true]{color:var(--sl-color-white);border-color:var(--sl-color-text-accent);font-weight:600}.tablist-wrapper:where(.astro-oqf2tref)~[role=tabpanel]{margin-top:1rem}
+.sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
+starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
+.sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
+<script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
+	(() => {
+		const openBtn = document.querySelector('button[data-open-modal]');
+		const shortcut = openBtn?.querySelector('kbd');
+		if (!openBtn || !(shortcut instanceof HTMLElement)) return;
+		const platformKey = shortcut.querySelector('kbd');
+		if (platformKey && /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform)) {
+			platformKey.textContent = '⌘';
+			openBtn.setAttribute('aria-keyshortcuts', 'Meta+K');
+		}
+		shortcut.style.display = '';
+	})();
+</script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
+		(() => {
+			try {
+				if (!matchMedia('(min-width: 50em)').matches) return;
+				/** @type {HTMLElement | null} */
+				const target = document.querySelector('sl-sidebar-state-persist');
+				const state = JSON.parse(sessionStorage.getItem('sl-sidebar-state') || '0');
+				if (!target || !state || target.dataset.hash !== state.hash) return;
+				window._starlightScrollRestore = state.scroll;
+				customElements.define(
+					'sl-sidebar-restore',
+					class SidebarRestore extends HTMLElement {
+						connectedCallback() {
+							try {
+								const idx = parseInt(this.dataset.index || '');
+								const details = this.closest('details');
+								if (details && typeof state.open[idx] === 'boolean') details.open = state.open[idx];
+							} catch {}
+						}
+					}
+				);
+			} catch {}
+		})();
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+		(() => {
+			const scroller = document.getElementById('starlight__sidebar');
+			if (!window._starlightScrollRestore || !scroller) return;
+			scroller.scrollTop = window._starlightScrollRestore;
+			delete window._starlightScrollRestore;
+		})();
+	</script> </sl-sidebar-state-persist>  <div class="md:sl-hidden"> <div class="mobile-preferences sl-flex astro-qyfhjkv4"> <div class="sl-flex social-icons astro-qyfhjkv4"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">Focus Handling</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <p>Certain elements such as <code dir="auto">TextInput</code> accept input from the mouse/finger and
+also key events originating from (virtual) keyboards. In order for an item to receive
+these events, it must have focus. This is visible through the <code dir="auto">has-focus</code> (out) property.</p>
+<!-- (out)? -->
+<p>You can manually activate the focus on an element by calling <code dir="auto">focus()</code>:</p>
+<div class="expressive-code"><link rel="stylesheet" href="/tng/_astro/ec.x2uya.css"><script type="module" src="/tng/_astro/ec.8zarh.js"></script><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">import</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#4EC9B0;--1:#227188">Button</span><span style="--0:#CCCCCC;--1:#3B3B3B"> } </span><span style="--0:#569CD6;--1:#0000FF">from</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#CE9178;--1:#A31515">"std-widgets.slint"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">App</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">VerticalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">alignment</span><span style="--0:#CCCCCC;--1:#3B3B3B">: start;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Button</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"press me"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">            </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">clicked => { input.focus(); }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">input</span><span style="--0:#CCCCCC;--1:#3B3B3B"> := </span><span style="--0:#4EC9B0;--1:#227188">TextInput</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"I am a text input field"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="import { Button } from &#x22;std-widgets.slint&#x22;;export component App inherits Window {    VerticalLayout {        alignment: start;        Button {            text: &#x22;press me&#x22;;            clicked => { input.focus(); }        }        input := TextInput {            text: &#x22;I am a text input field&#x22;;        }    }}"><div></div></button></div></figure></div>
+<p>Similarly, you can manually clear the focus on an element that’s currently focused, by calling <code dir="auto">clear-focus()</code>:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">import</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#4EC9B0;--1:#227188">Button</span><span style="--0:#CCCCCC;--1:#3B3B3B"> } </span><span style="--0:#569CD6;--1:#0000FF">from</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#CE9178;--1:#A31515">"std-widgets.slint"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">App</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">VerticalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">alignment</span><span style="--0:#CCCCCC;--1:#3B3B3B">: start;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Button</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"press me"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">            </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">clicked => { input.clear-focus(); }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">input</span><span style="--0:#CCCCCC;--1:#3B3B3B"> := </span><span style="--0:#4EC9B0;--1:#227188">TextInput</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"I am a text input field"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="import { Button } from &#x22;std-widgets.slint&#x22;;export component App inherits Window {    VerticalLayout {        alignment: start;        Button {            text: &#x22;press me&#x22;;            clicked => { input.clear-focus(); }        }        input := TextInput {            text: &#x22;I am a text input field&#x22;;        }    }}"><div></div></button></div></figure></div>
+<p>After clearing the focus, keyboard input to the window is discarded until another element is explicitly
+focused. For example by calling <code dir="auto">focus()</code>, an element acquiring focus when the user clicks on it, or when
+pressing tab and the first focusable element is found.</p>
+<p>If you have wrapped the <code dir="auto">TextInput</code> in a component, then you can forward such a focus activation
+using the <code dir="auto">forward-focus</code> property to refer to the element that should receive it:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">import</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#4EC9B0;--1:#227188">Button</span><span style="--0:#CCCCCC;--1:#3B3B3B"> } </span><span style="--0:#569CD6;--1:#0000FF">from</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#CE9178;--1:#A31515">"std-widgets.slint"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">LabeledInput</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">GridLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">forward-focus</span><span style="--0:#CCCCCC;--1:#3B3B3B">: input;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">Row</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Text</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"Input Label:"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">input</span><span style="--0:#CCCCCC;--1:#3B3B3B"> := </span><span style="--0:#4EC9B0;--1:#227188">TextInput</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">App</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">GridLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Button</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"press me"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">            </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">clicked => { label.focus(); }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">label</span><span style="--0:#CCCCCC;--1:#3B3B3B"> := </span><span style="--0:#4EC9B0;--1:#227188">LabeledInput</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="import { Button } from &#x22;std-widgets.slint&#x22;;component LabeledInput inherits GridLayout {    forward-focus: input;    Row {        Text {            text: &#x22;Input Label:&#x22;;        }        input := TextInput {}    }}export component App inherits Window {    GridLayout {        Button {            text: &#x22;press me&#x22;;            clicked => { label.focus(); }        }        label := LabeledInput {        }    }}"><div></div></button></div></figure></div>
+<p>If you use the <code dir="auto">forward-focus</code> property on a <code dir="auto">Window</code>, then the specified element will receive
+the focus the first time the window receives the focus - it becomes the initial focus element.</p> </div> <footer class="sl-flex astro-7fvjbusy"> <div class="meta sl-flex astro-7fvjbusy">   </div> <div class="pagination-links astro-s2mh7mvg" dir="ltr">   </div>   </footer>  </div> </div>   </main> </div> </div>  </div> </div>  </body></html>
\ No newline at end of file
diff --git a/snapshots/tng/guide/fonts/index.html b/snapshots/tng/guide/fonts/index.html
new file mode 100644
index 000000000..6d90ccc2c
--- /dev/null
+++ b/snapshots/tng/guide/fonts/index.html
@@ -0,0 +1,96 @@
+<!DOCTYPE html><html lang="en" dir="ltr" data-has-toc data-has-sidebar data-theme="dark" class="astro-qk6vovz3"> <head><meta charset="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><title>Font Handling | </title><link rel="canonical" href="https://snapshots.slint.dev/tng/guide/fonts/"/><link rel="sitemap" href="/tng/sitemap-index.xml"/><link rel="shortcut icon" href="/tng/favicon.svg" type="image/svg+xml"/><meta name="generator" content="Astro v4.16.10"/><meta name="generator" content="Starlight v0.28.6"/><meta property="og:title" content="Font Handling"/><meta property="og:type" content="article"/><meta property="og:url" content="https://snapshots.slint.dev/tng/guide/fonts/"/><meta property="og:locale" content="en"/><meta property="og:description" content="Font Handling"/><meta property="og:site_name" content=""/><meta name="twitter:card" content="summary_large_image"/><meta name="description" content="Font Handling"/><script>
+	window.StarlightThemeProvider = (() => {
+		const storedTheme =
+			typeof localStorage !== 'undefined' && localStorage.getItem('starlight-theme');
+		const theme =
+			storedTheme ||
+			(window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark');
+		document.documentElement.dataset.theme = theme === 'light' ? 'light' : 'dark';
+		return {
+			updatePickers(theme = storedTheme || 'auto') {
+				document.querySelectorAll('starlight-theme-select').forEach((picker) => {
+					const select = picker.querySelector('select');
+					if (select) select.value = theme;
+					/** @type {HTMLTemplateElement | null} */
+					const tmpl = document.querySelector(`#theme-icons`);
+					const newIcon = tmpl && tmpl.content.querySelector('.' + theme);
+					if (newIcon) {
+						const oldIcon = picker.querySelector('svg.label-icon');
+						if (oldIcon) {
+							oldIcon.replaceChildren(...newIcon.cloneNode(true).childNodes);
+						}
+					}
+				});
+			},
+		};
+	})();
+</script><template id="theme-icons"><svg aria-hidden="true" class="light astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M5 12a1 1 0 0 0-1-1H3a1 1 0 0 0 0 2h1a1 1 0 0 0 1-1Zm.64 5-.71.71a1 1 0 0 0 0 1.41 1 1 0 0 0 1.41 0l.71-.71A1 1 0 0 0 5.64 17ZM12 5a1 1 0 0 0 1-1V3a1 1 0 0 0-2 0v1a1 1 0 0 0 1 1Zm5.66 2.34a1 1 0 0 0 .7-.29l.71-.71a1 1 0 1 0-1.41-1.41l-.66.71a1 1 0 0 0 0 1.41 1 1 0 0 0 .66.29Zm-12-.29a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.71-.71a1.004 1.004 0 1 0-1.43 1.41l.73.71ZM21 11h-1a1 1 0 0 0 0 2h1a1 1 0 0 0 0-2Zm-2.64 6A1 1 0 0 0 17 18.36l.71.71a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.76-.66ZM12 6.5a5.5 5.5 0 1 0 5.5 5.5A5.51 5.51 0 0 0 12 6.5Zm0 9a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7Zm0 3.5a1 1 0 0 0-1 1v1a1 1 0 0 0 2 0v-1a1 1 0 0 0-1-1Z"/></svg> <svg aria-hidden="true" class="dark astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.64 13a1 1 0 0 0-1.05-.14 8.049 8.049 0 0 1-3.37.73 8.15 8.15 0 0 1-8.14-8.1 8.59 8.59 0 0 1 .25-2A1 1 0 0 0 8 2.36a10.14 10.14 0 1 0 14 11.69 1 1 0 0 0-.36-1.05Zm-9.5 6.69A8.14 8.14 0 0 1 7.08 5.22v.27a10.15 10.15 0 0 0 10.14 10.14 9.784 9.784 0 0 0 2.1-.22 8.11 8.11 0 0 1-7.18 4.32v-.04Z"/></svg> <svg aria-hidden="true" class="auto astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg> </template><link rel="stylesheet" href="/tng/_astro/index.Dw8nZVol.css">
+<link rel="stylesheet" href="/tng/_astro/markdown.BIW0eA3J.css">
+<style>:root{--sl-badge-default-border: var(--sl-color-accent);--sl-badge-default-bg: var(--sl-color-accent-low);--sl-badge-default-text: #fff;--sl-badge-note-border: var(--sl-color-blue);--sl-badge-note-bg: var(--sl-color-blue-low);--sl-badge-note-text: #fff;--sl-badge-danger-border: var(--sl-color-red);--sl-badge-danger-bg: var(--sl-color-red-low);--sl-badge-danger-text: #fff;--sl-badge-success-border: var(--sl-color-green);--sl-badge-success-bg: var(--sl-color-green-low);--sl-badge-success-text: #fff;--sl-badge-caution-border: var(--sl-color-orange);--sl-badge-caution-bg: var(--sl-color-orange-low);--sl-badge-caution-text: #fff;--sl-badge-tip-border: var(--sl-color-purple);--sl-badge-tip-bg: var(--sl-color-purple-low);--sl-badge-tip-text: #fff}[data-theme=light]:root{--sl-badge-default-bg: var(--sl-color-accent-high);--sl-badge-note-bg: var(--sl-color-blue-high);--sl-badge-danger-bg: var(--sl-color-red-high);--sl-badge-success-bg: var(--sl-color-green-high);--sl-badge-caution-bg: var(--sl-color-orange-high);--sl-badge-tip-bg: var(--sl-color-purple-high)}.sl-badge:where(.astro-sudhlwkh){display:inline-block;border:1px solid var(--sl-color-border-badge);border-radius:.25rem;font-family:var(--sl-font-system-mono);line-height:normal;color:var(--sl-color-text-badge);background-color:var(--sl-color-bg-badge);overflow-wrap:anywhere}.sidebar-content .sl-badge:where(.astro-sudhlwkh){line-height:1;font-size:var(--sl-text-xs);padding:.125rem .375rem}.sidebar-content a[aria-current=page]>.sl-badge:where(.astro-sudhlwkh){--sl-color-bg-badge: transparent;--sl-color-border-badge: currentColor;color:inherit}.default:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-default-bg);--sl-color-border-badge: var(--sl-badge-default-border);--sl-color-text-badge: var(--sl-badge-default-text)}.note:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-note-bg);--sl-color-border-badge: var(--sl-badge-note-border);--sl-color-text-badge: var(--sl-badge-note-text)}.danger:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-danger-bg);--sl-color-border-badge: var(--sl-badge-danger-border);--sl-color-text-badge: var(--sl-badge-danger-text)}.success:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-success-bg);--sl-color-border-badge: var(--sl-badge-success-border);--sl-color-text-badge: var(--sl-badge-success-text)}.tip:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-tip-bg);--sl-color-border-badge: var(--sl-badge-tip-border);--sl-color-text-badge: var(--sl-badge-tip-text)}.caution:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-caution-bg);--sl-color-border-badge: var(--sl-badge-caution-border);--sl-color-text-badge: var(--sl-badge-caution-text)}.small:where(.astro-sudhlwkh){font-size:var(--sl-text-xs);padding:.125rem .25rem}.medium:where(.astro-sudhlwkh){font-size:var(--sl-text-sm);padding:.175rem .35rem}.large:where(.astro-sudhlwkh){font-size:var(--sl-text-base);padding:.225rem .45rem}.sl-markdown-content :is(h1,h2,h3,h4,h5,h6) .sl-badge:where(.astro-sudhlwkh){vertical-align:middle}
+.card-grid:where(.astro-q6zci5ae){display:grid;gap:1rem}.card-grid:where(.astro-q6zci5ae)>*{margin-top:0!important}@media (min-width: 50rem){.card-grid:where(.astro-q6zci5ae){grid-template-columns:1fr 1fr;gap:1.5rem}.stagger:where(.astro-q6zci5ae){--stagger-height: 5rem;padding-bottom:var(--stagger-height)}.stagger:where(.astro-q6zci5ae)>*:nth-child(2n){transform:translateY(var(--stagger-height))}}
+.card:where(.astro-pxlzet7z){--sl-card-border: var(--sl-color-purple);--sl-card-bg: var(--sl-color-purple-low);border:1px solid var(--sl-color-gray-5);background-color:var(--sl-color-black);padding:clamp(1rem,calc(.125rem + 3vw),2.5rem);flex-direction:column;gap:clamp(.5rem,calc(.125rem + 1vw),1rem)}.card:where(.astro-pxlzet7z):nth-child(4n+1){--sl-card-border: var(--sl-color-orange);--sl-card-bg: var(--sl-color-orange-low)}.card:where(.astro-pxlzet7z):nth-child(4n+3){--sl-card-border: var(--sl-color-green);--sl-card-bg: var(--sl-color-green-low)}.card:where(.astro-pxlzet7z):nth-child(4n+4){--sl-card-border: var(--sl-color-red);--sl-card-bg: var(--sl-color-red-low)}.card:where(.astro-pxlzet7z):nth-child(4n+5){--sl-card-border: var(--sl-color-blue);--sl-card-bg: var(--sl-color-blue-low)}.title:where(.astro-pxlzet7z){font-weight:600;font-size:var(--sl-text-h4);color:var(--sl-color-white);line-height:var(--sl-line-height-headings);gap:1rem;align-items:center}.card:where(.astro-pxlzet7z) .icon:where(.astro-pxlzet7z){border:1px solid var(--sl-card-border);background-color:var(--sl-card-bg);padding:.2em;border-radius:.25rem}.card:where(.astro-pxlzet7z) .body:where(.astro-pxlzet7z){margin:0;font-size:clamp(var(--sl-text-sm),calc(.5rem + 1vw),var(--sl-text-body))}
+svg:where(.astro-bncqquy7){color:var(--sl-icon-color);font-size:var(--sl-icon-size, 1em);width:1em;height:1em}
+starlight-tabs:where(.astro-oqf2tref){display:block}.tablist-wrapper:where(.astro-oqf2tref){overflow-x:auto}:where(.astro-oqf2tref)[role=tablist]{display:flex;list-style:none;border-bottom:2px solid var(--sl-color-gray-5);padding:0}.tab:where(.astro-oqf2tref){margin-bottom:-2px}.tab:where(.astro-oqf2tref)>:where(.astro-oqf2tref)[role=tab]{display:flex;align-items:center;gap:.5rem;padding:0 1.25rem;text-decoration:none;border-bottom:2px solid var(--sl-color-gray-5);color:var(--sl-color-gray-3);outline-offset:var(--sl-outline-offset-inside);overflow-wrap:initial}.tab:where(.astro-oqf2tref) :where(.astro-oqf2tref)[role=tab][aria-selected=true]{color:var(--sl-color-white);border-color:var(--sl-color-text-accent);font-weight:600}.tablist-wrapper:where(.astro-oqf2tref)~[role=tabpanel]{margin-top:1rem}
+.sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
+starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
+.sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
+<script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
+	(() => {
+		const openBtn = document.querySelector('button[data-open-modal]');
+		const shortcut = openBtn?.querySelector('kbd');
+		if (!openBtn || !(shortcut instanceof HTMLElement)) return;
+		const platformKey = shortcut.querySelector('kbd');
+		if (platformKey && /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform)) {
+			platformKey.textContent = '⌘';
+			openBtn.setAttribute('aria-keyshortcuts', 'Meta+K');
+		}
+		shortcut.style.display = '';
+	})();
+</script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
+		(() => {
+			try {
+				if (!matchMedia('(min-width: 50em)').matches) return;
+				/** @type {HTMLElement | null} */
+				const target = document.querySelector('sl-sidebar-state-persist');
+				const state = JSON.parse(sessionStorage.getItem('sl-sidebar-state') || '0');
+				if (!target || !state || target.dataset.hash !== state.hash) return;
+				window._starlightScrollRestore = state.scroll;
+				customElements.define(
+					'sl-sidebar-restore',
+					class SidebarRestore extends HTMLElement {
+						connectedCallback() {
+							try {
+								const idx = parseInt(this.dataset.index || '');
+								const details = this.closest('details');
+								if (details && typeof state.open[idx] === 'boolean') details.open = state.open[idx];
+							} catch {}
+						}
+					}
+				);
+			} catch {}
+		})();
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+		(() => {
+			const scroller = document.getElementById('starlight__sidebar');
+			if (!window._starlightScrollRestore || !scroller) return;
+			scroller.scrollTop = window._starlightScrollRestore;
+			delete window._starlightScrollRestore;
+		})();
+	</script> </sl-sidebar-state-persist>  <div class="md:sl-hidden"> <div class="mobile-preferences sl-flex astro-qyfhjkv4"> <div class="sl-flex social-icons astro-qyfhjkv4"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">Font Handling</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <p>Elements such as <code dir="auto">Text</code> and <code dir="auto">TextInput</code> can render text and allow customizing the appearance of the text through
+different properties. The properties prefixed with <code dir="auto">font-</code>, such as <code dir="auto">font-family</code>, <code dir="auto">font-size</code> and <code dir="auto">font-weight</code>
+affect the choice of font used for rendering to the screen. If any of these properties isn’t specified, the <code dir="auto">default-font-</code>
+values in the surrounding <code dir="auto">Window</code> element apply, such as <code dir="auto">default-font-family</code>.</p>
+<p>The fonts chosen for rendering are automatically picked up from the system running the application. It’s also possible to include custom
+fonts in your design. A custom font must be a TrueType font (<code dir="auto">.ttf</code>), a TrueType font collection (<code dir="auto">.ttc</code>) or an OpenType font (<code dir="auto">.otf</code>).
+You can select a custom font with the <code dir="auto">import</code> statement: <code dir="auto">import "./my_custom_font.ttf"</code> in a .slint file. This
+instructs the Slint compiler to include the font and makes the font families globally available for use with
+<code dir="auto">font-family</code> properties.</p>
+<p>For example:</p>
+<div class="expressive-code"><link rel="stylesheet" href="/tng/_astro/ec.x2uya.css"><script type="module" src="/tng/_astro/ec.8zarh.js"></script><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint,ignore"><code><div class="ec-line"><div class="code"><span style="--0:#cccccc;--1:#3b3b3b">import "./NotoSans-Regular.ttf";</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span style="--0:#cccccc;--1:#3b3b3b">export component Example inherits Window {</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">default-font-family: "Noto Sans";</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">Text {</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">        </span></span><span style="--0:#cccccc;--1:#3b3b3b">text: "Hello World";</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#cccccc;--1:#3b3b3b">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="import &#x22;./NotoSans-Regular.ttf&#x22;;export component Example inherits Window {    default-font-family: &#x22;Noto Sans&#x22;;    Text {        text: &#x22;Hello World&#x22;;    }}"><div></div></button></div></figure></div> </div> <footer class="sl-flex astro-7fvjbusy"> <div class="meta sl-flex astro-7fvjbusy">   </div> <div class="pagination-links astro-s2mh7mvg" dir="ltr">   </div>   </footer>  </div> </div>   </main> </div> </div>  </div> </div>  </body></html>
\ No newline at end of file
diff --git a/snapshots/tng/guide/functions/index.html b/snapshots/tng/guide/functions/index.html
index d22bfb847..60ad1abf9 100644
--- a/snapshots/tng/guide/functions/index.html
+++ b/snapshots/tng/guide/functions/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
@@ -81,8 +81,7 @@
 		})();
 	</script> </sl-sidebar-state-persist>  <div class="md:sl-hidden"> <div class="mobile-preferences sl-flex astro-qyfhjkv4"> <div class="sl-flex social-icons astro-qyfhjkv4"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#declaring-functions" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Declaring functions</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#calling-a-function" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Calling a function</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#name-resolution" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Name resolution</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#function-visibility" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Function visibility</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#functions-vs-callbacks" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Functions vs. callbacks</span> </a>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#declaring-functions" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Declaring functions</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#calling-a-function" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Calling a function</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#name-resolution" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Name resolution</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#function-visibility" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Function visibility</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#functions-vs-callbacks" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Functions vs. callbacks</span> </a>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">Functions</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <h1 id="functions">Functions</h1>
-<p>Similar to other programming languages, functions in Slint are way to name, organize and reuse
+</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#declaring-functions" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Declaring functions</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#calling-a-function" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Calling a function</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#name-resolution" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Name resolution</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#function-visibility" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Function visibility</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#functions-vs-callbacks" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Functions vs. callbacks</span> </a>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#declaring-functions" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Declaring functions</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#calling-a-function" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Calling a function</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#name-resolution" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Name resolution</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#function-visibility" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Function visibility</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#functions-vs-callbacks" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Functions vs. callbacks</span> </a>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">Functions</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <p>Similar to other programming languages, functions in Slint are way to name, organize and reuse
 a piece of logic/code.</p>
 <p>Functions can be defined as part of a component, or as part of an element within a component.
 It is not possible to declare global (top-level) functions, or to declare them as part of a
diff --git a/snapshots/tng/guide/intro/index.html b/snapshots/tng/guide/intro/index.html
index c49908dac..af5f263ef 100644
--- a/snapshots/tng/guide/intro/index.html
+++ b/snapshots/tng/guide/intro/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/guide/layouting/index.html b/snapshots/tng/guide/layouting/index.html
new file mode 100644
index 000000000..a5de76a66
--- /dev/null
+++ b/snapshots/tng/guide/layouting/index.html
@@ -0,0 +1,234 @@
+<!DOCTYPE html><html lang="en" dir="ltr" data-has-toc data-has-sidebar data-theme="dark" class="astro-qk6vovz3"> <head><meta charset="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><title>Positioning and Layout of Elements | </title><link rel="canonical" href="https://snapshots.slint.dev/tng/guide/layouting/"/><link rel="sitemap" href="/tng/sitemap-index.xml"/><link rel="shortcut icon" href="/tng/favicon.svg" type="image/svg+xml"/><meta name="generator" content="Astro v4.16.10"/><meta name="generator" content="Starlight v0.28.6"/><meta property="og:title" content="Positioning and Layout of Elements"/><meta property="og:type" content="article"/><meta property="og:url" content="https://snapshots.slint.dev/tng/guide/layouting/"/><meta property="og:locale" content="en"/><meta property="og:description" content="Positioning and Layout of ElementsContainer Components"/><meta property="og:site_name" content=""/><meta name="twitter:card" content="summary_large_image"/><meta name="description" content="Positioning and Layout of ElementsContainer Components"/><script>
+	window.StarlightThemeProvider = (() => {
+		const storedTheme =
+			typeof localStorage !== 'undefined' && localStorage.getItem('starlight-theme');
+		const theme =
+			storedTheme ||
+			(window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark');
+		document.documentElement.dataset.theme = theme === 'light' ? 'light' : 'dark';
+		return {
+			updatePickers(theme = storedTheme || 'auto') {
+				document.querySelectorAll('starlight-theme-select').forEach((picker) => {
+					const select = picker.querySelector('select');
+					if (select) select.value = theme;
+					/** @type {HTMLTemplateElement | null} */
+					const tmpl = document.querySelector(`#theme-icons`);
+					const newIcon = tmpl && tmpl.content.querySelector('.' + theme);
+					if (newIcon) {
+						const oldIcon = picker.querySelector('svg.label-icon');
+						if (oldIcon) {
+							oldIcon.replaceChildren(...newIcon.cloneNode(true).childNodes);
+						}
+					}
+				});
+			},
+		};
+	})();
+</script><template id="theme-icons"><svg aria-hidden="true" class="light astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M5 12a1 1 0 0 0-1-1H3a1 1 0 0 0 0 2h1a1 1 0 0 0 1-1Zm.64 5-.71.71a1 1 0 0 0 0 1.41 1 1 0 0 0 1.41 0l.71-.71A1 1 0 0 0 5.64 17ZM12 5a1 1 0 0 0 1-1V3a1 1 0 0 0-2 0v1a1 1 0 0 0 1 1Zm5.66 2.34a1 1 0 0 0 .7-.29l.71-.71a1 1 0 1 0-1.41-1.41l-.66.71a1 1 0 0 0 0 1.41 1 1 0 0 0 .66.29Zm-12-.29a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.71-.71a1.004 1.004 0 1 0-1.43 1.41l.73.71ZM21 11h-1a1 1 0 0 0 0 2h1a1 1 0 0 0 0-2Zm-2.64 6A1 1 0 0 0 17 18.36l.71.71a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.76-.66ZM12 6.5a5.5 5.5 0 1 0 5.5 5.5A5.51 5.51 0 0 0 12 6.5Zm0 9a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7Zm0 3.5a1 1 0 0 0-1 1v1a1 1 0 0 0 2 0v-1a1 1 0 0 0-1-1Z"/></svg> <svg aria-hidden="true" class="dark astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.64 13a1 1 0 0 0-1.05-.14 8.049 8.049 0 0 1-3.37.73 8.15 8.15 0 0 1-8.14-8.1 8.59 8.59 0 0 1 .25-2A1 1 0 0 0 8 2.36a10.14 10.14 0 1 0 14 11.69 1 1 0 0 0-.36-1.05Zm-9.5 6.69A8.14 8.14 0 0 1 7.08 5.22v.27a10.15 10.15 0 0 0 10.14 10.14 9.784 9.784 0 0 0 2.1-.22 8.11 8.11 0 0 1-7.18 4.32v-.04Z"/></svg> <svg aria-hidden="true" class="auto astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg> </template><link rel="stylesheet" href="/tng/_astro/index.Dw8nZVol.css">
+<link rel="stylesheet" href="/tng/_astro/markdown.BIW0eA3J.css">
+<style>:root{--sl-badge-default-border: var(--sl-color-accent);--sl-badge-default-bg: var(--sl-color-accent-low);--sl-badge-default-text: #fff;--sl-badge-note-border: var(--sl-color-blue);--sl-badge-note-bg: var(--sl-color-blue-low);--sl-badge-note-text: #fff;--sl-badge-danger-border: var(--sl-color-red);--sl-badge-danger-bg: var(--sl-color-red-low);--sl-badge-danger-text: #fff;--sl-badge-success-border: var(--sl-color-green);--sl-badge-success-bg: var(--sl-color-green-low);--sl-badge-success-text: #fff;--sl-badge-caution-border: var(--sl-color-orange);--sl-badge-caution-bg: var(--sl-color-orange-low);--sl-badge-caution-text: #fff;--sl-badge-tip-border: var(--sl-color-purple);--sl-badge-tip-bg: var(--sl-color-purple-low);--sl-badge-tip-text: #fff}[data-theme=light]:root{--sl-badge-default-bg: var(--sl-color-accent-high);--sl-badge-note-bg: var(--sl-color-blue-high);--sl-badge-danger-bg: var(--sl-color-red-high);--sl-badge-success-bg: var(--sl-color-green-high);--sl-badge-caution-bg: var(--sl-color-orange-high);--sl-badge-tip-bg: var(--sl-color-purple-high)}.sl-badge:where(.astro-sudhlwkh){display:inline-block;border:1px solid var(--sl-color-border-badge);border-radius:.25rem;font-family:var(--sl-font-system-mono);line-height:normal;color:var(--sl-color-text-badge);background-color:var(--sl-color-bg-badge);overflow-wrap:anywhere}.sidebar-content .sl-badge:where(.astro-sudhlwkh){line-height:1;font-size:var(--sl-text-xs);padding:.125rem .375rem}.sidebar-content a[aria-current=page]>.sl-badge:where(.astro-sudhlwkh){--sl-color-bg-badge: transparent;--sl-color-border-badge: currentColor;color:inherit}.default:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-default-bg);--sl-color-border-badge: var(--sl-badge-default-border);--sl-color-text-badge: var(--sl-badge-default-text)}.note:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-note-bg);--sl-color-border-badge: var(--sl-badge-note-border);--sl-color-text-badge: var(--sl-badge-note-text)}.danger:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-danger-bg);--sl-color-border-badge: var(--sl-badge-danger-border);--sl-color-text-badge: var(--sl-badge-danger-text)}.success:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-success-bg);--sl-color-border-badge: var(--sl-badge-success-border);--sl-color-text-badge: var(--sl-badge-success-text)}.tip:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-tip-bg);--sl-color-border-badge: var(--sl-badge-tip-border);--sl-color-text-badge: var(--sl-badge-tip-text)}.caution:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-caution-bg);--sl-color-border-badge: var(--sl-badge-caution-border);--sl-color-text-badge: var(--sl-badge-caution-text)}.small:where(.astro-sudhlwkh){font-size:var(--sl-text-xs);padding:.125rem .25rem}.medium:where(.astro-sudhlwkh){font-size:var(--sl-text-sm);padding:.175rem .35rem}.large:where(.astro-sudhlwkh){font-size:var(--sl-text-base);padding:.225rem .45rem}.sl-markdown-content :is(h1,h2,h3,h4,h5,h6) .sl-badge:where(.astro-sudhlwkh){vertical-align:middle}
+.card-grid:where(.astro-q6zci5ae){display:grid;gap:1rem}.card-grid:where(.astro-q6zci5ae)>*{margin-top:0!important}@media (min-width: 50rem){.card-grid:where(.astro-q6zci5ae){grid-template-columns:1fr 1fr;gap:1.5rem}.stagger:where(.astro-q6zci5ae){--stagger-height: 5rem;padding-bottom:var(--stagger-height)}.stagger:where(.astro-q6zci5ae)>*:nth-child(2n){transform:translateY(var(--stagger-height))}}
+.card:where(.astro-pxlzet7z){--sl-card-border: var(--sl-color-purple);--sl-card-bg: var(--sl-color-purple-low);border:1px solid var(--sl-color-gray-5);background-color:var(--sl-color-black);padding:clamp(1rem,calc(.125rem + 3vw),2.5rem);flex-direction:column;gap:clamp(.5rem,calc(.125rem + 1vw),1rem)}.card:where(.astro-pxlzet7z):nth-child(4n+1){--sl-card-border: var(--sl-color-orange);--sl-card-bg: var(--sl-color-orange-low)}.card:where(.astro-pxlzet7z):nth-child(4n+3){--sl-card-border: var(--sl-color-green);--sl-card-bg: var(--sl-color-green-low)}.card:where(.astro-pxlzet7z):nth-child(4n+4){--sl-card-border: var(--sl-color-red);--sl-card-bg: var(--sl-color-red-low)}.card:where(.astro-pxlzet7z):nth-child(4n+5){--sl-card-border: var(--sl-color-blue);--sl-card-bg: var(--sl-color-blue-low)}.title:where(.astro-pxlzet7z){font-weight:600;font-size:var(--sl-text-h4);color:var(--sl-color-white);line-height:var(--sl-line-height-headings);gap:1rem;align-items:center}.card:where(.astro-pxlzet7z) .icon:where(.astro-pxlzet7z){border:1px solid var(--sl-card-border);background-color:var(--sl-card-bg);padding:.2em;border-radius:.25rem}.card:where(.astro-pxlzet7z) .body:where(.astro-pxlzet7z){margin:0;font-size:clamp(var(--sl-text-sm),calc(.5rem + 1vw),var(--sl-text-body))}
+svg:where(.astro-bncqquy7){color:var(--sl-icon-color);font-size:var(--sl-icon-size, 1em);width:1em;height:1em}
+starlight-tabs:where(.astro-oqf2tref){display:block}.tablist-wrapper:where(.astro-oqf2tref){overflow-x:auto}:where(.astro-oqf2tref)[role=tablist]{display:flex;list-style:none;border-bottom:2px solid var(--sl-color-gray-5);padding:0}.tab:where(.astro-oqf2tref){margin-bottom:-2px}.tab:where(.astro-oqf2tref)>:where(.astro-oqf2tref)[role=tab]{display:flex;align-items:center;gap:.5rem;padding:0 1.25rem;text-decoration:none;border-bottom:2px solid var(--sl-color-gray-5);color:var(--sl-color-gray-3);outline-offset:var(--sl-outline-offset-inside);overflow-wrap:initial}.tab:where(.astro-oqf2tref) :where(.astro-oqf2tref)[role=tab][aria-selected=true]{color:var(--sl-color-white);border-color:var(--sl-color-text-accent);font-weight:600}.tablist-wrapper:where(.astro-oqf2tref)~[role=tabpanel]{margin-top:1rem}
+.sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
+starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
+.sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
+<script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
+	(() => {
+		const openBtn = document.querySelector('button[data-open-modal]');
+		const shortcut = openBtn?.querySelector('kbd');
+		if (!openBtn || !(shortcut instanceof HTMLElement)) return;
+		const platformKey = shortcut.querySelector('kbd');
+		if (platformKey && /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform)) {
+			platformKey.textContent = '⌘';
+			openBtn.setAttribute('aria-keyshortcuts', 'Meta+K');
+		}
+		shortcut.style.display = '';
+	})();
+</script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
+		(() => {
+			try {
+				if (!matchMedia('(min-width: 50em)').matches) return;
+				/** @type {HTMLElement | null} */
+				const target = document.querySelector('sl-sidebar-state-persist');
+				const state = JSON.parse(sessionStorage.getItem('sl-sidebar-state') || '0');
+				if (!target || !state || target.dataset.hash !== state.hash) return;
+				window._starlightScrollRestore = state.scroll;
+				customElements.define(
+					'sl-sidebar-restore',
+					class SidebarRestore extends HTMLElement {
+						connectedCallback() {
+							try {
+								const idx = parseInt(this.dataset.index || '');
+								const details = this.closest('details');
+								if (details && typeof state.open[idx] === 'boolean') details.open = state.open[idx];
+							} catch {}
+						}
+					}
+				);
+			} catch {}
+		})();
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+		(() => {
+			const scroller = document.getElementById('starlight__sidebar');
+			if (!window._starlightScrollRestore || !scroller) return;
+			scroller.scrollTop = window._starlightScrollRestore;
+			delete window._starlightScrollRestore;
+		})();
+	</script> </sl-sidebar-state-persist>  <div class="md:sl-hidden"> <div class="mobile-preferences sl-flex astro-qyfhjkv4"> <div class="sl-flex social-icons astro-qyfhjkv4"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#explicit-placement" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Explicit Placement</span> </a> <ul class="isMobile astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#preferred-size" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Preferred size</span> </a>  </li> </ul>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#automatic-placement-using-layouts" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Automatic Placement Using Layouts</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#common-properties-on-layout-elements" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Common Properties on Layout Elements</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#verticallayout-and-horizontallayout" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">VerticalLayout and HorizontalLayout</span> </a> <ul class="isMobile astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#alignment" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Alignment</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#stretch-algorithm" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Stretch algorithm</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#for" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">for</span> </a>  </li> </ul>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#gridlayout" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">GridLayout</span> </a>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#explicit-placement" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Explicit Placement</span> </a> <ul class="astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#preferred-size" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Preferred size</span> </a>  </li> </ul>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#automatic-placement-using-layouts" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Automatic Placement Using Layouts</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#common-properties-on-layout-elements" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Common Properties on Layout Elements</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#verticallayout-and-horizontallayout" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">VerticalLayout and HorizontalLayout</span> </a> <ul class="astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#alignment" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Alignment</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#stretch-algorithm" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Stretch algorithm</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#for" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">for</span> </a>  </li> </ul>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#gridlayout" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">GridLayout</span> </a>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">Positioning and Layout of Elements</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <p>All visual elements are shown in a window. The <code dir="auto">x</code> and <code dir="auto">y</code> properties store
+the elements coordinates relative to their parent element. Slint determines the
+absolute position of an element by adding the parent’s position to
+the element’s position. If the parent has a parent element itself, then that one
+is added as well. This calculation continues until the top-level element
+is reached.</p>
+<p>The <code dir="auto">width</code> and <code dir="auto">height</code> properties store the size of visual elements.</p>
+<p>You can create an entire graphical user interface by placing the elements in
+two ways:</p>
+<ul>
+<li>Explicitly - by setting the <code dir="auto">x</code>, <code dir="auto">y</code>, <code dir="auto">width</code>, and <code dir="auto">height</code> properties.</li>
+<li>Automatically - by using layout elements.</li>
+</ul>
+<p>Explicit placement is great for static scenes with few elements. Layouts are
+suitable for complex user interfaces and help create scalable user interfaces.
+Layout elements express geometric relationships between elements.</p>
+<h2 id="explicit-placement">Explicit Placement</h2>
+<p>The following example places two rectangles into a window, a blue one and
+a green one. The green rectangle is a child of the blue:</p>
+<div class="expressive-code"><link rel="stylesheet" href="/tng/_astro/ec.x2uya.css"><script type="module" src="/tng/_astro/ec.8zarh.js"></script><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#76A162;--1:#007A00">// Explicit positioning</span></div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Example</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">x</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">100px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">y</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">70px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#569CD6;--1:#0000FF">parent</span><span style="--0:#CCCCCC;--1:#3B3B3B">.width - </span><span style="--0:#569CD6;--1:#0000FF">self</span><span style="--0:#CCCCCC;--1:#3B3B3B">.x;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#569CD6;--1:#0000FF">parent</span><span style="--0:#CCCCCC;--1:#3B3B3B">.height - </span><span style="--0:#569CD6;--1:#0000FF">self</span><span style="--0:#CCCCCC;--1:#3B3B3B">.y;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">x</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">10px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">y</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">5px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">50px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">30px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: green;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="// Explicit positioningexport component Example inherits Window {    width: 200px;    height: 200px;    Rectangle {        x: 100px;        y: 70px;        width: parent.width - self.x;        height: parent.height - self.y;        background: blue;        Rectangle {            x: 10px;            y: 5px;            width: 50px;            height: 30px;            background: green;        }    }}"><div></div></button></div></figure></div>
+<p>The positions of both rectangles and the size of the inner green one are fixed.
+The outer blue rectangle has a size that’s automatically calculated using binding
+expressions for the <code dir="auto">width</code> and <code dir="auto">height</code> properties. The calculation results in the
+bottom left corner aligning with the corner of the window - it updates whenever
+the <code dir="auto">width</code> and <code dir="auto">height</code> of the window changes.</p>
+<p>When specifying explicit values for any of the geometric properties, Slint requires
+you to attach a unit to the number. You can choose between two different units:</p>
+<ul>
+<li>Logical pixels, using the <code dir="auto">px</code> unit suffix. This is the recommended unit.</li>
+<li>Physical pixels, using the <code dir="auto">phx</code> unit suffix</li>
+</ul>
+<p>Logical pixels scale automatically with the device pixel ratio that your system is
+configured with. For example, on a modern High-DPI display the device pixel ratio can be 2,
+so every logical pixel occupies 2 physical pixels. On an older screen the user
+interface scales without any adaptations.</p>
+<p>You can also specify the <code dir="auto">width</code> and <code dir="auto">height</code> properties as a <code dir="auto">%</code> percentage
+unit, which applies relative to the parent element. For example a <code dir="auto">width: 50%</code> means half
+of the parent’s <code dir="auto">width</code>.</p>
+<p>The default values for <code dir="auto">x</code> and <code dir="auto">y</code> properties center elements within their
+parent.</p>
+<p>The default values for <code dir="auto">width</code> and <code dir="auto">height</code> depend on the type of element. Some elements are sized
+automatically based on their content, such as <code dir="auto">Image</code>, <code dir="auto">Text</code>, and most widgets. The following elements
+don’t have content and default to fill their parent element when they do not have children:</p>
+<ul>
+<li><code dir="auto">Rectangle</code></li>
+<li><code dir="auto">TouchArea</code></li>
+<li><code dir="auto">FocusScope</code></li>
+<li><code dir="auto">Flickable</code></li>
+</ul>
+<p>Layouts are also defaulting to fill the parent, regardless of their own preferred size.</p>
+<!-- Without base? -->
+<p>Other elements (including custom ones without base) default to using their preferred size.</p>
+<h3 id="preferred-size">Preferred size</h3>
+<p>You can specify the preferred size of elements with the <code dir="auto">preferred-width</code> and <code dir="auto">preferred-height</code> properties.</p>
+<p>When not explicitly set, the preferred size depends on the children, and is the preferred size of the
+child that has the bigger preferred size, whose <code dir="auto">x</code> and <code dir="auto">y</code> property are not set.
+The preferred size is therefore computed from the child to the parent, just like other constraints (maximum and minimum size), unless explicitly overwritten.</p>
+<p>A special case is to set the preferred size to be the size of the parent using <code dir="auto">100%</code> as value.
+For example, this component uses the size of the parent by default:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">MyComponent</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">preferred-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">100</span><span style="--0:#CCCCCC;--1:#3B3B3B">%;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">preferred-height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">100</span><span style="--0:#CCCCCC;--1:#3B3B3B">%;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#76A162;--1:#007A00">// ...</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="export component MyComponent {    preferred-width: 100%;    preferred-height: 100%;    // ...}"><div></div></button></div></figure></div>
+<h2 id="automatic-placement-using-layouts">Automatic Placement Using Layouts</h2>
+<p>Slint comes with different layout elements that automatically calculate the position and size of their children:</p>
+<ul>
+<li><code dir="auto">VerticalLayout</code> / <code dir="auto">HorizontalLayout</code>: The children are placed along the vertical or horizontal axis.</li>
+<li><code dir="auto">GridLayout</code>: The children are placed in a grid of columns and rows.</li>
+</ul>
+<p>You can also nest layouts to create complex user interfaces.</p>
+<p>You can tune the automatic placement using different constraints, to accommodate the design of your user
+interface. Each element has a minimum, a maximum size, and a preferred size. Set these explicitly using the
+following properties:</p>
+<ul>
+<li><code dir="auto">min-width</code></li>
+<li><code dir="auto">min-height</code></li>
+<li><code dir="auto">max-width</code></li>
+<li><code dir="auto">max-height</code></li>
+<li><code dir="auto">preferred-width</code></li>
+<li><code dir="auto">preferred-height</code></li>
+</ul>
+<p>Any element with a specified <code dir="auto">width</code> and <code dir="auto">height</code> has a fixed size in a layout.</p>
+<p>When there is extra space in a layout, elements can stretch along the layout axis. You can control this stretch
+factor between the element and its siblings with these properties:</p>
+<ul>
+<li><code dir="auto">horizontal-stretch</code></li>
+<li><code dir="auto">vertical-stretch</code></li>
+</ul>
+<p>A value of <code dir="auto">0</code> means that the element won’t stretch at all. All elements stretch
+equally if they all have a stretch factor of <code dir="auto">0</code>.</p>
+<p>The default value of these constraint properties may depends on the content of the element.
+If the element’s <code dir="auto">x</code> or <code dir="auto">y</code> isn’t set, these constraints are also automatically
+applied to the parent element.</p>
+<h2 id="common-properties-on-layout-elements">Common Properties on Layout Elements</h2>
+<p>All layout elements have the following properties in common:</p>
+<ul>
+<li><code dir="auto">spacing</code>: This controls the spacing between the children.</li>
+<li><code dir="auto">padding</code>: This specifies the padding within the layout, the space between the elements and the border of the
+layout.</li>
+</ul>
+<p>For more fine grained control, you can split the <code dir="auto">padding</code> property into properties for each side of the layout:</p>
+<ul>
+<li><code dir="auto">padding-left</code></li>
+<li><code dir="auto">padding-right</code></li>
+<li><code dir="auto">padding-top</code></li>
+<li><code dir="auto">padding-bottom</code></li>
+</ul>
+<h2 id="verticallayout-and-horizontallayout"><code dir="auto">VerticalLayout</code> and <code dir="auto">HorizontalLayout</code></h2>
+<p>The <code dir="auto">VerticalLayout</code> and <code dir="auto">HorizontalLayout</code> elements place their children in a
+column or a row. By default, they stretch or shrink to take the whole space. You
+can adjust the element’s alignment as needed.</p>
+<p>The following example places the blue and yellow rectangle in a row and evenly stretched
+across the 200 logical pixels of <code dir="auto">width</code>:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#76A162;--1:#007A00">// Stretch by default</span></div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Example</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">20px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: yellow; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">30px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="// Stretch by defaultexport component Example inherits Window {    width: 200px;    height: 200px;    HorizontalLayout {        Rectangle { background: blue; min-width: 20px; }        Rectangle { background: yellow; min-width: 30px; }    }}"><div></div></button></div></figure></div>
+<p>The example below, on the other hand, specifies that the rectangles align
+to the start of the layout (the visual left). That results in no stretching but instead
+the rectangles retain their specified minimum width:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#76A162;--1:#007A00">// Unless an alignment is specified</span></div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Example</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">alignment</span><span style="--0:#CCCCCC;--1:#3B3B3B">: start;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">20px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: yellow; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">30px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="// Unless an alignment is specifiedexport component Example inherits Window {    width: 200px;    height: 200px;    HorizontalLayout {        alignment: start;        Rectangle { background: blue; min-width: 20px; }        Rectangle { background: yellow; min-width: 30px; }    }}"><div></div></button></div></figure></div>
+<p>The example below nests two layouts for a more complex scene:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Example</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#76A162;--1:#007A00">// Side panel</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: green; </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">10px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">VerticalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">padding</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">0px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#76A162;--1:#007A00">//toolbar</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">7px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">                </span><span style="--0:#9CDCFE;--1:#001080">border-color</span><span style="--0:#CCCCCC;--1:#3B3B3B">: red; </span><span style="--0:#9CDCFE;--1:#001080">border-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">2px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">                </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">                    </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">border-color</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; </span><span style="--0:#9CDCFE;--1:#001080">border-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">2px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">                    </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">border-color</span><span style="--0:#CCCCCC;--1:#3B3B3B">: green; </span><span style="--0:#9CDCFE;--1:#001080">border-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">2px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">                </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">            </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">                </span><span style="--0:#9CDCFE;--1:#001080">border-color</span><span style="--0:#CCCCCC;--1:#3B3B3B">: orange; </span><span style="--0:#9CDCFE;--1:#001080">border-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">2px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">                </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">                    </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">border-color</span><span style="--0:#CCCCCC;--1:#3B3B3B">: black; </span><span style="--0:#9CDCFE;--1:#001080">border-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">2px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">                    </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">border-color</span><span style="--0:#CCCCCC;--1:#3B3B3B">: pink; </span><span style="--0:#9CDCFE;--1:#001080">border-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">2px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">                </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">            </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="export component Example inherits Window {    width: 200px;    height: 200px;    HorizontalLayout {        // Side panel        Rectangle { background: green; width: 10px; }        VerticalLayout {            padding: 0px;            //toolbar            Rectangle { background: blue; height: 7px; }            Rectangle {                border-color: red; border-width: 2px;                HorizontalLayout {                    Rectangle { border-color: blue; border-width: 2px; }                    Rectangle { border-color: green; border-width: 2px; }                }            }            Rectangle {                border-color: orange; border-width: 2px;                HorizontalLayout {                    Rectangle { border-color: black; border-width: 2px; }                    Rectangle { border-color: pink; border-width: 2px; }                }            }        }    }}"><div></div></button></div></figure></div>
+<h3 id="alignment">Alignment</h3>
+<p>Each element is sized according to their <code dir="auto">width</code> or <code dir="auto">height</code> if specified, otherwise it’s
+set to the minimum size which is set with the min-width or min-height property, or
+the minimum size of an inner layout, whatever is bigger.</p>
+<p>The elements are placed according to the alignment. The size of elements
+is bigger than the minimum size only if the <code dir="auto">alignment</code> property of the layout is <code dir="auto">LayoutAlignment.stretch</code> (the default)</p>
+<p>This example show the different alignment possibilities:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Example</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">300px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">VerticalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">alignment</span><span style="--0:#CCCCCC;--1:#3B3B3B">: stretch;</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Text</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"stretch (default)"</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">20px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: yellow; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">30px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">alignment</span><span style="--0:#CCCCCC;--1:#3B3B3B">: start;</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Text</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"start"</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">20px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: yellow; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">30px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">alignment</span><span style="--0:#CCCCCC;--1:#3B3B3B">: end;</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Text</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"end"</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">20px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: yellow; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">30px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">alignment</span><span style="--0:#CCCCCC;--1:#3B3B3B">: start;</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Text</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"start"</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">20px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: yellow; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">30px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">alignment</span><span style="--0:#CCCCCC;--1:#3B3B3B">: center;</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Text</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"center"</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">20px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: yellow; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">30px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">alignment</span><span style="--0:#CCCCCC;--1:#3B3B3B">: space-between;</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Text</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"space-between"</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">20px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: yellow; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">30px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">alignment</span><span style="--0:#CCCCCC;--1:#3B3B3B">: space-around;</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Text</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"space-around"</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">20px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: yellow; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">30px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="export component Example inherits Window {    width: 300px;    height: 200px;    VerticalLayout {        HorizontalLayout {            alignment: stretch;            Text { text: &#x22;stretch (default)&#x22;; }            Rectangle { background: blue; min-width: 20px; }            Rectangle { background: yellow; min-width: 30px; }        }        HorizontalLayout {            alignment: start;            Text { text: &#x22;start&#x22;; }            Rectangle { background: blue; min-width: 20px; }            Rectangle { background: yellow; min-width: 30px; }        }        HorizontalLayout {            alignment: end;            Text { text: &#x22;end&#x22;; }            Rectangle { background: blue; min-width: 20px; }            Rectangle { background: yellow; min-width: 30px; }        }        HorizontalLayout {            alignment: start;            Text { text: &#x22;start&#x22;; }            Rectangle { background: blue; min-width: 20px; }            Rectangle { background: yellow; min-width: 30px; }        }        HorizontalLayout {            alignment: center;            Text { text: &#x22;center&#x22;; }            Rectangle { background: blue; min-width: 20px; }            Rectangle { background: yellow; min-width: 30px; }        }        HorizontalLayout {            alignment: space-between;            Text { text: &#x22;space-between&#x22;; }            Rectangle { background: blue; min-width: 20px; }            Rectangle { background: yellow; min-width: 30px; }        }        HorizontalLayout {            alignment: space-around;            Text { text: &#x22;space-around&#x22;; }            Rectangle { background: blue; min-width: 20px; }            Rectangle { background: yellow; min-width: 30px; }        }    }}"><div></div></button></div></figure></div>
+<h3 id="stretch-algorithm">Stretch algorithm</h3>
+<p>When the <code dir="auto">alignment</code> is set to stretch (the default), the elements are sized to their minimum size,
+then the extra space is shared amongst element proportional to their stretch factor set with the
+<code dir="auto">horizontal-stretch</code> and <code dir="auto">vertical-stretch</code> properties. The stretched size won’t exceed the maximum size.
+The stretch factor is a floating point number. The elements that have a default content size usually defaults to 0
+while elements that default to the size of their parents defaults to 1.
+An element of a stretch factor of 0 keep its minimum size, unless all the other elements also have a stretch
+factor of 0 or reached their maximum size.</p>
+<p>Examples:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Example</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">300px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">VerticalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#76A162;--1:#007A00">// Same stretch factor (1 by default): the size is divided equally</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: yellow;}</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: green;}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#76A162;--1:#007A00">// Elements with a bigger min-width are given a bigger size before they expand</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: cyan; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">100px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;}</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: magenta; </span><span style="--0:#9CDCFE;--1:#001080">min-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">50px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;}</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: gold;}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#76A162;--1:#007A00">// Stretch factor twice as big:  grows twice as much</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: navy; </span><span style="--0:#9CDCFE;--1:#001080">horizontal-stretch</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">2</span><span style="--0:#CCCCCC;--1:#3B3B3B">;}</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: gray; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#76A162;--1:#007A00">// All elements not having a maximum width have a stretch factor of 0 so they grow</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: red; </span><span style="--0:#9CDCFE;--1:#001080">max-width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">20px</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: orange; </span><span style="--0:#9CDCFE;--1:#001080">horizontal-stretch</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">0</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: pink; </span><span style="--0:#9CDCFE;--1:#001080">horizontal-stretch</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">0</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="export component Example inherits Window {    width: 300px;    height: 200px;    VerticalLayout {        // Same stretch factor (1 by default): the size is divided equally        HorizontalLayout {            Rectangle { background: blue; }            Rectangle { background: yellow;}            Rectangle { background: green;}        }        // Elements with a bigger min-width are given a bigger size before they expand        HorizontalLayout {            Rectangle { background: cyan; min-width: 100px;}            Rectangle { background: magenta; min-width: 50px;}            Rectangle { background: gold;}        }        // Stretch factor twice as big:  grows twice as much        HorizontalLayout {            Rectangle { background: navy; horizontal-stretch: 2;}            Rectangle { background: gray; }        }        // All elements not having a maximum width have a stretch factor of 0 so they grow        HorizontalLayout {            Rectangle { background: red; max-width: 20px; }            Rectangle { background: orange; horizontal-stretch: 0; }            Rectangle { background: pink; horizontal-stretch: 0; }        }    }}"><div></div></button></div></figure></div>
+<h3 id="for"><code dir="auto">for</code></h3>
+<p>The VerticalLayout and HorizontalLayout can also contain <code dir="auto">for</code> or <code dir="auto">if</code> expressions:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Example</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">50px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">HorizontalLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: green; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#C586C0;--1:#AC00D8">for</span><span style="--0:#CCCCCC;--1:#3B3B3B"> t </span><span style="--0:#569CD6;--1:#0000FF">in</span><span style="--0:#CCCCCC;--1:#3B3B3B"> [ </span><span style="--0:#CE9178;--1:#A31515">"Hello"</span><span style="--0:#CCCCCC;--1:#3B3B3B">, </span><span style="--0:#CE9178;--1:#A31515">"World"</span><span style="--0:#CCCCCC;--1:#3B3B3B">, </span><span style="--0:#CE9178;--1:#A31515">"!"</span><span style="--0:#CCCCCC;--1:#3B3B3B"> ] : </span><span style="--0:#4EC9B0;--1:#227188">Text</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: t;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="export component Example inherits Window {    width: 200px;    height: 50px;    HorizontalLayout {        Rectangle { background: green; }        for t in [ &#x22;Hello&#x22;, &#x22;World&#x22;, &#x22;!&#x22; ] : Text {            text: t;        }        Rectangle { background: blue; }    }}"><div></div></button></div></figure></div>
+<h2 id="gridlayout">GridLayout</h2>
+<p>The GridLayout lays the element in a grid.
+Each element gains the properties <code dir="auto">row</code>, <code dir="auto">col</code>, <code dir="auto">rowspan</code>, and <code dir="auto">colspan</code>.
+You can either use a <code dir="auto">Row</code> sub-element, or set the <code dir="auto">row</code> property explicitly.
+These properties must be statically known at compile time, so it’s impossible
+to use arithmetic or depend on properties. As of now, the use of <code dir="auto">for</code> or <code dir="auto">if</code>
+isn’t allowed in a grid layout.</p>
+<p>This example use the <code dir="auto">Row</code> element</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Foo</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">GridLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">spacing</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">5px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Row</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: red; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Row</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: yellow; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">            </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: green; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">        </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="export component Foo inherits Window {    width: 200px;    height: 200px;    GridLayout {        spacing: 5px;        Row {            Rectangle { background: red; }            Rectangle { background: blue; }        }        Row {            Rectangle { background: yellow; }            Rectangle { background: green; }        }    }}"><div></div></button></div></figure></div>
+<p>This example use the <code dir="auto">col</code> and <code dir="auto">row</code> property:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Foo</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">150px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">GridLayout</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">spacing</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">0px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: red; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: blue; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: yellow; </span><span style="--0:#9CDCFE;--1:#001080">row</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">1</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: green; }</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#4EC9B0;--1:#227188">Rectangle</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#9CDCFE;--1:#001080">background</span><span style="--0:#CCCCCC;--1:#3B3B3B">: black; </span><span style="--0:#9CDCFE;--1:#001080">col</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">2</span><span style="--0:#CCCCCC;--1:#3B3B3B">; </span><span style="--0:#9CDCFE;--1:#001080">row</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">0</span><span style="--0:#CCCCCC;--1:#3B3B3B">; }</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="export component Foo inherits Window {    width: 200px;    height: 150px;    GridLayout {        spacing: 0px;        Rectangle { background: red; }        Rectangle { background: blue; }        Rectangle { background: yellow; row: 1; }        Rectangle { background: green; }        Rectangle { background: black; col: 2; row: 0; }    }}"><div></div></button></div></figure></div> </div> <footer class="sl-flex astro-7fvjbusy"> <div class="meta sl-flex astro-7fvjbusy">   </div> <div class="pagination-links astro-s2mh7mvg" dir="ltr">   </div>   </footer>  </div> </div>   </main> </div> </div>  </div> </div>  </body></html>
\ No newline at end of file
diff --git a/snapshots/tng/guide/layouts/index.html b/snapshots/tng/guide/layouts/index.html
index db4036e66..bb0b91c6d 100644
--- a/snapshots/tng/guide/layouts/index.html
+++ b/snapshots/tng/guide/layouts/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/guide/preview/index.html b/snapshots/tng/guide/preview/index.html
index 6cbdd5bc6..7b99191c3 100644
--- a/snapshots/tng/guide/preview/index.html
+++ b/snapshots/tng/guide/preview/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/guide/purity/index.html b/snapshots/tng/guide/purity/index.html
new file mode 100644
index 000000000..95fd5dfb0
--- /dev/null
+++ b/snapshots/tng/guide/purity/index.html
@@ -0,0 +1,105 @@
+<!DOCTYPE html><html lang="en" dir="ltr" data-has-toc data-has-sidebar data-theme="dark" class="astro-qk6vovz3"> <head><meta charset="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><title>Purity | </title><link rel="canonical" href="https://snapshots.slint.dev/tng/guide/purity/"/><link rel="sitemap" href="/tng/sitemap-index.xml"/><link rel="shortcut icon" href="/tng/favicon.svg" type="image/svg+xml"/><meta name="generator" content="Astro v4.16.10"/><meta name="generator" content="Starlight v0.28.6"/><meta property="og:title" content="Purity"/><meta property="og:type" content="article"/><meta property="og:url" content="https://snapshots.slint.dev/tng/guide/purity/"/><meta property="og:locale" content="en"/><meta property="og:description" content="Purity"/><meta property="og:site_name" content=""/><meta name="twitter:card" content="summary_large_image"/><meta name="description" content="Purity"/><script>
+	window.StarlightThemeProvider = (() => {
+		const storedTheme =
+			typeof localStorage !== 'undefined' && localStorage.getItem('starlight-theme');
+		const theme =
+			storedTheme ||
+			(window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark');
+		document.documentElement.dataset.theme = theme === 'light' ? 'light' : 'dark';
+		return {
+			updatePickers(theme = storedTheme || 'auto') {
+				document.querySelectorAll('starlight-theme-select').forEach((picker) => {
+					const select = picker.querySelector('select');
+					if (select) select.value = theme;
+					/** @type {HTMLTemplateElement | null} */
+					const tmpl = document.querySelector(`#theme-icons`);
+					const newIcon = tmpl && tmpl.content.querySelector('.' + theme);
+					if (newIcon) {
+						const oldIcon = picker.querySelector('svg.label-icon');
+						if (oldIcon) {
+							oldIcon.replaceChildren(...newIcon.cloneNode(true).childNodes);
+						}
+					}
+				});
+			},
+		};
+	})();
+</script><template id="theme-icons"><svg aria-hidden="true" class="light astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M5 12a1 1 0 0 0-1-1H3a1 1 0 0 0 0 2h1a1 1 0 0 0 1-1Zm.64 5-.71.71a1 1 0 0 0 0 1.41 1 1 0 0 0 1.41 0l.71-.71A1 1 0 0 0 5.64 17ZM12 5a1 1 0 0 0 1-1V3a1 1 0 0 0-2 0v1a1 1 0 0 0 1 1Zm5.66 2.34a1 1 0 0 0 .7-.29l.71-.71a1 1 0 1 0-1.41-1.41l-.66.71a1 1 0 0 0 0 1.41 1 1 0 0 0 .66.29Zm-12-.29a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.71-.71a1.004 1.004 0 1 0-1.43 1.41l.73.71ZM21 11h-1a1 1 0 0 0 0 2h1a1 1 0 0 0 0-2Zm-2.64 6A1 1 0 0 0 17 18.36l.71.71a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.76-.66ZM12 6.5a5.5 5.5 0 1 0 5.5 5.5A5.51 5.51 0 0 0 12 6.5Zm0 9a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7Zm0 3.5a1 1 0 0 0-1 1v1a1 1 0 0 0 2 0v-1a1 1 0 0 0-1-1Z"/></svg> <svg aria-hidden="true" class="dark astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.64 13a1 1 0 0 0-1.05-.14 8.049 8.049 0 0 1-3.37.73 8.15 8.15 0 0 1-8.14-8.1 8.59 8.59 0 0 1 .25-2A1 1 0 0 0 8 2.36a10.14 10.14 0 1 0 14 11.69 1 1 0 0 0-.36-1.05Zm-9.5 6.69A8.14 8.14 0 0 1 7.08 5.22v.27a10.15 10.15 0 0 0 10.14 10.14 9.784 9.784 0 0 0 2.1-.22 8.11 8.11 0 0 1-7.18 4.32v-.04Z"/></svg> <svg aria-hidden="true" class="auto astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg> </template><link rel="stylesheet" href="/tng/_astro/index.Dw8nZVol.css">
+<link rel="stylesheet" href="/tng/_astro/markdown.BIW0eA3J.css">
+<style>:root{--sl-badge-default-border: var(--sl-color-accent);--sl-badge-default-bg: var(--sl-color-accent-low);--sl-badge-default-text: #fff;--sl-badge-note-border: var(--sl-color-blue);--sl-badge-note-bg: var(--sl-color-blue-low);--sl-badge-note-text: #fff;--sl-badge-danger-border: var(--sl-color-red);--sl-badge-danger-bg: var(--sl-color-red-low);--sl-badge-danger-text: #fff;--sl-badge-success-border: var(--sl-color-green);--sl-badge-success-bg: var(--sl-color-green-low);--sl-badge-success-text: #fff;--sl-badge-caution-border: var(--sl-color-orange);--sl-badge-caution-bg: var(--sl-color-orange-low);--sl-badge-caution-text: #fff;--sl-badge-tip-border: var(--sl-color-purple);--sl-badge-tip-bg: var(--sl-color-purple-low);--sl-badge-tip-text: #fff}[data-theme=light]:root{--sl-badge-default-bg: var(--sl-color-accent-high);--sl-badge-note-bg: var(--sl-color-blue-high);--sl-badge-danger-bg: var(--sl-color-red-high);--sl-badge-success-bg: var(--sl-color-green-high);--sl-badge-caution-bg: var(--sl-color-orange-high);--sl-badge-tip-bg: var(--sl-color-purple-high)}.sl-badge:where(.astro-sudhlwkh){display:inline-block;border:1px solid var(--sl-color-border-badge);border-radius:.25rem;font-family:var(--sl-font-system-mono);line-height:normal;color:var(--sl-color-text-badge);background-color:var(--sl-color-bg-badge);overflow-wrap:anywhere}.sidebar-content .sl-badge:where(.astro-sudhlwkh){line-height:1;font-size:var(--sl-text-xs);padding:.125rem .375rem}.sidebar-content a[aria-current=page]>.sl-badge:where(.astro-sudhlwkh){--sl-color-bg-badge: transparent;--sl-color-border-badge: currentColor;color:inherit}.default:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-default-bg);--sl-color-border-badge: var(--sl-badge-default-border);--sl-color-text-badge: var(--sl-badge-default-text)}.note:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-note-bg);--sl-color-border-badge: var(--sl-badge-note-border);--sl-color-text-badge: var(--sl-badge-note-text)}.danger:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-danger-bg);--sl-color-border-badge: var(--sl-badge-danger-border);--sl-color-text-badge: var(--sl-badge-danger-text)}.success:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-success-bg);--sl-color-border-badge: var(--sl-badge-success-border);--sl-color-text-badge: var(--sl-badge-success-text)}.tip:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-tip-bg);--sl-color-border-badge: var(--sl-badge-tip-border);--sl-color-text-badge: var(--sl-badge-tip-text)}.caution:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-caution-bg);--sl-color-border-badge: var(--sl-badge-caution-border);--sl-color-text-badge: var(--sl-badge-caution-text)}.small:where(.astro-sudhlwkh){font-size:var(--sl-text-xs);padding:.125rem .25rem}.medium:where(.astro-sudhlwkh){font-size:var(--sl-text-sm);padding:.175rem .35rem}.large:where(.astro-sudhlwkh){font-size:var(--sl-text-base);padding:.225rem .45rem}.sl-markdown-content :is(h1,h2,h3,h4,h5,h6) .sl-badge:where(.astro-sudhlwkh){vertical-align:middle}
+.card-grid:where(.astro-q6zci5ae){display:grid;gap:1rem}.card-grid:where(.astro-q6zci5ae)>*{margin-top:0!important}@media (min-width: 50rem){.card-grid:where(.astro-q6zci5ae){grid-template-columns:1fr 1fr;gap:1.5rem}.stagger:where(.astro-q6zci5ae){--stagger-height: 5rem;padding-bottom:var(--stagger-height)}.stagger:where(.astro-q6zci5ae)>*:nth-child(2n){transform:translateY(var(--stagger-height))}}
+.card:where(.astro-pxlzet7z){--sl-card-border: var(--sl-color-purple);--sl-card-bg: var(--sl-color-purple-low);border:1px solid var(--sl-color-gray-5);background-color:var(--sl-color-black);padding:clamp(1rem,calc(.125rem + 3vw),2.5rem);flex-direction:column;gap:clamp(.5rem,calc(.125rem + 1vw),1rem)}.card:where(.astro-pxlzet7z):nth-child(4n+1){--sl-card-border: var(--sl-color-orange);--sl-card-bg: var(--sl-color-orange-low)}.card:where(.astro-pxlzet7z):nth-child(4n+3){--sl-card-border: var(--sl-color-green);--sl-card-bg: var(--sl-color-green-low)}.card:where(.astro-pxlzet7z):nth-child(4n+4){--sl-card-border: var(--sl-color-red);--sl-card-bg: var(--sl-color-red-low)}.card:where(.astro-pxlzet7z):nth-child(4n+5){--sl-card-border: var(--sl-color-blue);--sl-card-bg: var(--sl-color-blue-low)}.title:where(.astro-pxlzet7z){font-weight:600;font-size:var(--sl-text-h4);color:var(--sl-color-white);line-height:var(--sl-line-height-headings);gap:1rem;align-items:center}.card:where(.astro-pxlzet7z) .icon:where(.astro-pxlzet7z){border:1px solid var(--sl-card-border);background-color:var(--sl-card-bg);padding:.2em;border-radius:.25rem}.card:where(.astro-pxlzet7z) .body:where(.astro-pxlzet7z){margin:0;font-size:clamp(var(--sl-text-sm),calc(.5rem + 1vw),var(--sl-text-body))}
+svg:where(.astro-bncqquy7){color:var(--sl-icon-color);font-size:var(--sl-icon-size, 1em);width:1em;height:1em}
+starlight-tabs:where(.astro-oqf2tref){display:block}.tablist-wrapper:where(.astro-oqf2tref){overflow-x:auto}:where(.astro-oqf2tref)[role=tablist]{display:flex;list-style:none;border-bottom:2px solid var(--sl-color-gray-5);padding:0}.tab:where(.astro-oqf2tref){margin-bottom:-2px}.tab:where(.astro-oqf2tref)>:where(.astro-oqf2tref)[role=tab]{display:flex;align-items:center;gap:.5rem;padding:0 1.25rem;text-decoration:none;border-bottom:2px solid var(--sl-color-gray-5);color:var(--sl-color-gray-3);outline-offset:var(--sl-outline-offset-inside);overflow-wrap:initial}.tab:where(.astro-oqf2tref) :where(.astro-oqf2tref)[role=tab][aria-selected=true]{color:var(--sl-color-white);border-color:var(--sl-color-text-accent);font-weight:600}.tablist-wrapper:where(.astro-oqf2tref)~[role=tabpanel]{margin-top:1rem}
+.sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
+starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
+.sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
+<script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
+	(() => {
+		const openBtn = document.querySelector('button[data-open-modal]');
+		const shortcut = openBtn?.querySelector('kbd');
+		if (!openBtn || !(shortcut instanceof HTMLElement)) return;
+		const platformKey = shortcut.querySelector('kbd');
+		if (platformKey && /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform)) {
+			platformKey.textContent = '⌘';
+			openBtn.setAttribute('aria-keyshortcuts', 'Meta+K');
+		}
+		shortcut.style.display = '';
+	})();
+</script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
+		(() => {
+			try {
+				if (!matchMedia('(min-width: 50em)').matches) return;
+				/** @type {HTMLElement | null} */
+				const target = document.querySelector('sl-sidebar-state-persist');
+				const state = JSON.parse(sessionStorage.getItem('sl-sidebar-state') || '0');
+				if (!target || !state || target.dataset.hash !== state.hash) return;
+				window._starlightScrollRestore = state.scroll;
+				customElements.define(
+					'sl-sidebar-restore',
+					class SidebarRestore extends HTMLElement {
+						connectedCallback() {
+							try {
+								const idx = parseInt(this.dataset.index || '');
+								const details = this.closest('details');
+								if (details && typeof state.open[idx] === 'boolean') details.open = state.open[idx];
+							} catch {}
+						}
+					}
+				);
+			} catch {}
+		})();
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+		(() => {
+			const scroller = document.getElementById('starlight__sidebar');
+			if (!window._starlightScrollRestore || !scroller) return;
+			scroller.scrollTop = window._starlightScrollRestore;
+			delete window._starlightScrollRestore;
+		})();
+	</script> </sl-sidebar-state-persist>  <div class="md:sl-hidden"> <div class="mobile-preferences sl-flex astro-qyfhjkv4"> <div class="sl-flex social-icons astro-qyfhjkv4"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">Purity</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <p>Slint’s property evaluation is lazy and “reactive”. Property
+bindings are evaluated when reading the property value. Dependencies between properties are
+automatically discovered during property evaluation. The property stores the
+result of the evaluation. When a property changes, all dependent properties get
+notified, so that the next time their value is read, their binding is re-evaluated.</p>
+<p>For any reactive system to work well, evaluating a property shouldn’t change any
+observable state but the property itself. If this is the case, then the expression
+is “pure”, otherwise it’s said to have side-effects. Side-effects are problematic
+because it’s not always clear when they will happen: Lazy evaluation may change
+their order or affect whether they happen at all. In addition, changes to
+properties during their binding evaluation due to a side-effect may result in
+unexpected behavior.</p>
+<p>For this reason, bindings in Slint <em>must</em> be pure. The Slint compiler enforces
+code in pure contexts to be free of side effects. Pure contexts include binding
+expressions, bodies of pure functions, and bodies of pure callback handlers.
+In such a context, it’s not allowed to change a property, or call a non-pure
+callback or function.</p>
+<p>Annotate callbacks and public functions with the <code dir="auto">pure</code> keyword to make them
+accessible from property bindings and other pure callbacks and functions.</p>
+<p>The purity of private functions is automatically inferred. You may declare
+private functions explicitly “pure” to have the compiler enforce their purity.</p>
+<div class="expressive-code"><link rel="stylesheet" href="/tng/_astro/ec.x2uya.css"><script type="module" src="/tng/_astro/ec.8zarh.js"></script><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint,no-preview"><code><div class="ec-line"><div class="code"><span style="--0:#cccccc;--1:#3b3b3b">export component Example {</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">pure callback foo() -> int;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">public pure function bar(x: int) -> int</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">{ return x + foo(); }</span></div></div><div class="ec-line"><div class="code"><span style="--0:#cccccc;--1:#3b3b3b">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="export component Example {    pure callback foo() -> int;    public pure function bar(x: int) -> int    { return x + foo(); }}"><div></div></button></div></figure></div> </div> <footer class="sl-flex astro-7fvjbusy"> <div class="meta sl-flex astro-7fvjbusy">   </div> <div class="pagination-links astro-s2mh7mvg" dir="ltr">   </div>   </footer>  </div> </div>   </main> </div> </div>  </div> </div>  </body></html>
\ No newline at end of file
diff --git a/snapshots/tng/guide/reactive/index.html b/snapshots/tng/guide/reactive/index.html
index 914695973..b4fd20450 100644
--- a/snapshots/tng/guide/reactive/index.html
+++ b/snapshots/tng/guide/reactive/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/guide/states/index.html b/snapshots/tng/guide/states/index.html
index 86237b7dd..8e587b955 100644
--- a/snapshots/tng/guide/states/index.html
+++ b/snapshots/tng/guide/states/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/guide/translations/index.html b/snapshots/tng/guide/translations/index.html
new file mode 100644
index 000000000..d9cb53592
--- /dev/null
+++ b/snapshots/tng/guide/translations/index.html
@@ -0,0 +1,202 @@
+<!DOCTYPE html><html lang="en" dir="ltr" data-has-toc data-has-sidebar data-theme="dark" class="astro-qk6vovz3"> <head><meta charset="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><title>Translations | </title><link rel="canonical" href="https://snapshots.slint.dev/tng/guide/translations/"/><link rel="sitemap" href="/tng/sitemap-index.xml"/><link rel="shortcut icon" href="/tng/favicon.svg" type="image/svg+xml"/><meta name="generator" content="Astro v4.16.10"/><meta name="generator" content="Starlight v0.28.6"/><meta property="og:title" content="Translations"/><meta property="og:type" content="article"/><meta property="og:url" content="https://snapshots.slint.dev/tng/guide/translations/"/><meta property="og:locale" content="en"/><meta property="og:description" content="Translations"/><meta property="og:site_name" content=""/><meta name="twitter:card" content="summary_large_image"/><meta name="description" content="Translations"/><script>
+	window.StarlightThemeProvider = (() => {
+		const storedTheme =
+			typeof localStorage !== 'undefined' && localStorage.getItem('starlight-theme');
+		const theme =
+			storedTheme ||
+			(window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark');
+		document.documentElement.dataset.theme = theme === 'light' ? 'light' : 'dark';
+		return {
+			updatePickers(theme = storedTheme || 'auto') {
+				document.querySelectorAll('starlight-theme-select').forEach((picker) => {
+					const select = picker.querySelector('select');
+					if (select) select.value = theme;
+					/** @type {HTMLTemplateElement | null} */
+					const tmpl = document.querySelector(`#theme-icons`);
+					const newIcon = tmpl && tmpl.content.querySelector('.' + theme);
+					if (newIcon) {
+						const oldIcon = picker.querySelector('svg.label-icon');
+						if (oldIcon) {
+							oldIcon.replaceChildren(...newIcon.cloneNode(true).childNodes);
+						}
+					}
+				});
+			},
+		};
+	})();
+</script><template id="theme-icons"><svg aria-hidden="true" class="light astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M5 12a1 1 0 0 0-1-1H3a1 1 0 0 0 0 2h1a1 1 0 0 0 1-1Zm.64 5-.71.71a1 1 0 0 0 0 1.41 1 1 0 0 0 1.41 0l.71-.71A1 1 0 0 0 5.64 17ZM12 5a1 1 0 0 0 1-1V3a1 1 0 0 0-2 0v1a1 1 0 0 0 1 1Zm5.66 2.34a1 1 0 0 0 .7-.29l.71-.71a1 1 0 1 0-1.41-1.41l-.66.71a1 1 0 0 0 0 1.41 1 1 0 0 0 .66.29Zm-12-.29a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.71-.71a1.004 1.004 0 1 0-1.43 1.41l.73.71ZM21 11h-1a1 1 0 0 0 0 2h1a1 1 0 0 0 0-2Zm-2.64 6A1 1 0 0 0 17 18.36l.71.71a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.76-.66ZM12 6.5a5.5 5.5 0 1 0 5.5 5.5A5.51 5.51 0 0 0 12 6.5Zm0 9a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7Zm0 3.5a1 1 0 0 0-1 1v1a1 1 0 0 0 2 0v-1a1 1 0 0 0-1-1Z"/></svg> <svg aria-hidden="true" class="dark astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.64 13a1 1 0 0 0-1.05-.14 8.049 8.049 0 0 1-3.37.73 8.15 8.15 0 0 1-8.14-8.1 8.59 8.59 0 0 1 .25-2A1 1 0 0 0 8 2.36a10.14 10.14 0 1 0 14 11.69 1 1 0 0 0-.36-1.05Zm-9.5 6.69A8.14 8.14 0 0 1 7.08 5.22v.27a10.15 10.15 0 0 0 10.14 10.14 9.784 9.784 0 0 0 2.1-.22 8.11 8.11 0 0 1-7.18 4.32v-.04Z"/></svg> <svg aria-hidden="true" class="auto astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg> </template><link rel="stylesheet" href="/tng/_astro/index.Dw8nZVol.css">
+<link rel="stylesheet" href="/tng/_astro/markdown.BIW0eA3J.css">
+<style>:root{--sl-badge-default-border: var(--sl-color-accent);--sl-badge-default-bg: var(--sl-color-accent-low);--sl-badge-default-text: #fff;--sl-badge-note-border: var(--sl-color-blue);--sl-badge-note-bg: var(--sl-color-blue-low);--sl-badge-note-text: #fff;--sl-badge-danger-border: var(--sl-color-red);--sl-badge-danger-bg: var(--sl-color-red-low);--sl-badge-danger-text: #fff;--sl-badge-success-border: var(--sl-color-green);--sl-badge-success-bg: var(--sl-color-green-low);--sl-badge-success-text: #fff;--sl-badge-caution-border: var(--sl-color-orange);--sl-badge-caution-bg: var(--sl-color-orange-low);--sl-badge-caution-text: #fff;--sl-badge-tip-border: var(--sl-color-purple);--sl-badge-tip-bg: var(--sl-color-purple-low);--sl-badge-tip-text: #fff}[data-theme=light]:root{--sl-badge-default-bg: var(--sl-color-accent-high);--sl-badge-note-bg: var(--sl-color-blue-high);--sl-badge-danger-bg: var(--sl-color-red-high);--sl-badge-success-bg: var(--sl-color-green-high);--sl-badge-caution-bg: var(--sl-color-orange-high);--sl-badge-tip-bg: var(--sl-color-purple-high)}.sl-badge:where(.astro-sudhlwkh){display:inline-block;border:1px solid var(--sl-color-border-badge);border-radius:.25rem;font-family:var(--sl-font-system-mono);line-height:normal;color:var(--sl-color-text-badge);background-color:var(--sl-color-bg-badge);overflow-wrap:anywhere}.sidebar-content .sl-badge:where(.astro-sudhlwkh){line-height:1;font-size:var(--sl-text-xs);padding:.125rem .375rem}.sidebar-content a[aria-current=page]>.sl-badge:where(.astro-sudhlwkh){--sl-color-bg-badge: transparent;--sl-color-border-badge: currentColor;color:inherit}.default:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-default-bg);--sl-color-border-badge: var(--sl-badge-default-border);--sl-color-text-badge: var(--sl-badge-default-text)}.note:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-note-bg);--sl-color-border-badge: var(--sl-badge-note-border);--sl-color-text-badge: var(--sl-badge-note-text)}.danger:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-danger-bg);--sl-color-border-badge: var(--sl-badge-danger-border);--sl-color-text-badge: var(--sl-badge-danger-text)}.success:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-success-bg);--sl-color-border-badge: var(--sl-badge-success-border);--sl-color-text-badge: var(--sl-badge-success-text)}.tip:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-tip-bg);--sl-color-border-badge: var(--sl-badge-tip-border);--sl-color-text-badge: var(--sl-badge-tip-text)}.caution:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-caution-bg);--sl-color-border-badge: var(--sl-badge-caution-border);--sl-color-text-badge: var(--sl-badge-caution-text)}.small:where(.astro-sudhlwkh){font-size:var(--sl-text-xs);padding:.125rem .25rem}.medium:where(.astro-sudhlwkh){font-size:var(--sl-text-sm);padding:.175rem .35rem}.large:where(.astro-sudhlwkh){font-size:var(--sl-text-base);padding:.225rem .45rem}.sl-markdown-content :is(h1,h2,h3,h4,h5,h6) .sl-badge:where(.astro-sudhlwkh){vertical-align:middle}
+.card-grid:where(.astro-q6zci5ae){display:grid;gap:1rem}.card-grid:where(.astro-q6zci5ae)>*{margin-top:0!important}@media (min-width: 50rem){.card-grid:where(.astro-q6zci5ae){grid-template-columns:1fr 1fr;gap:1.5rem}.stagger:where(.astro-q6zci5ae){--stagger-height: 5rem;padding-bottom:var(--stagger-height)}.stagger:where(.astro-q6zci5ae)>*:nth-child(2n){transform:translateY(var(--stagger-height))}}
+.card:where(.astro-pxlzet7z){--sl-card-border: var(--sl-color-purple);--sl-card-bg: var(--sl-color-purple-low);border:1px solid var(--sl-color-gray-5);background-color:var(--sl-color-black);padding:clamp(1rem,calc(.125rem + 3vw),2.5rem);flex-direction:column;gap:clamp(.5rem,calc(.125rem + 1vw),1rem)}.card:where(.astro-pxlzet7z):nth-child(4n+1){--sl-card-border: var(--sl-color-orange);--sl-card-bg: var(--sl-color-orange-low)}.card:where(.astro-pxlzet7z):nth-child(4n+3){--sl-card-border: var(--sl-color-green);--sl-card-bg: var(--sl-color-green-low)}.card:where(.astro-pxlzet7z):nth-child(4n+4){--sl-card-border: var(--sl-color-red);--sl-card-bg: var(--sl-color-red-low)}.card:where(.astro-pxlzet7z):nth-child(4n+5){--sl-card-border: var(--sl-color-blue);--sl-card-bg: var(--sl-color-blue-low)}.title:where(.astro-pxlzet7z){font-weight:600;font-size:var(--sl-text-h4);color:var(--sl-color-white);line-height:var(--sl-line-height-headings);gap:1rem;align-items:center}.card:where(.astro-pxlzet7z) .icon:where(.astro-pxlzet7z){border:1px solid var(--sl-card-border);background-color:var(--sl-card-bg);padding:.2em;border-radius:.25rem}.card:where(.astro-pxlzet7z) .body:where(.astro-pxlzet7z){margin:0;font-size:clamp(var(--sl-text-sm),calc(.5rem + 1vw),var(--sl-text-body))}
+svg:where(.astro-bncqquy7){color:var(--sl-icon-color);font-size:var(--sl-icon-size, 1em);width:1em;height:1em}
+starlight-tabs:where(.astro-oqf2tref){display:block}.tablist-wrapper:where(.astro-oqf2tref){overflow-x:auto}:where(.astro-oqf2tref)[role=tablist]{display:flex;list-style:none;border-bottom:2px solid var(--sl-color-gray-5);padding:0}.tab:where(.astro-oqf2tref){margin-bottom:-2px}.tab:where(.astro-oqf2tref)>:where(.astro-oqf2tref)[role=tab]{display:flex;align-items:center;gap:.5rem;padding:0 1.25rem;text-decoration:none;border-bottom:2px solid var(--sl-color-gray-5);color:var(--sl-color-gray-3);outline-offset:var(--sl-outline-offset-inside);overflow-wrap:initial}.tab:where(.astro-oqf2tref) :where(.astro-oqf2tref)[role=tab][aria-selected=true]{color:var(--sl-color-white);border-color:var(--sl-color-text-accent);font-weight:600}.tablist-wrapper:where(.astro-oqf2tref)~[role=tabpanel]{margin-top:1rem}
+.sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
+starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
+.sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
+<script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
+	(() => {
+		const openBtn = document.querySelector('button[data-open-modal]');
+		const shortcut = openBtn?.querySelector('kbd');
+		if (!openBtn || !(shortcut instanceof HTMLElement)) return;
+		const platformKey = shortcut.querySelector('kbd');
+		if (platformKey && /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform)) {
+			platformKey.textContent = '⌘';
+			openBtn.setAttribute('aria-keyshortcuts', 'Meta+K');
+		}
+		shortcut.style.display = '';
+	})();
+</script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
+		(() => {
+			try {
+				if (!matchMedia('(min-width: 50em)').matches) return;
+				/** @type {HTMLElement | null} */
+				const target = document.querySelector('sl-sidebar-state-persist');
+				const state = JSON.parse(sessionStorage.getItem('sl-sidebar-state') || '0');
+				if (!target || !state || target.dataset.hash !== state.hash) return;
+				window._starlightScrollRestore = state.scroll;
+				customElements.define(
+					'sl-sidebar-restore',
+					class SidebarRestore extends HTMLElement {
+						connectedCallback() {
+							try {
+								const idx = parseInt(this.dataset.index || '');
+								const details = this.closest('details');
+								if (details && typeof state.open[idx] === 'boolean') details.open = state.open[idx];
+							} catch {}
+						}
+					}
+				);
+			} catch {}
+		})();
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+		(() => {
+			const scroller = document.getElementById('starlight__sidebar');
+			if (!window._starlightScrollRestore || !scroller) return;
+			scroller.scrollTop = window._starlightScrollRestore;
+			delete window._starlightScrollRestore;
+		})();
+	</script> </sl-sidebar-state-persist>  <div class="md:sl-hidden"> <div class="mobile-preferences sl-flex astro-qyfhjkv4"> <div class="sl-flex social-icons astro-qyfhjkv4"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#overview" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#annotating-translatable-strings" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Annotating Translatable Strings</span> </a> <ul class="isMobile astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#formatting" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Formatting</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#plurals" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Plurals</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#context" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Context</span> </a>  </li> </ul>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#extract-translatable-strings" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Extract Translatable Strings</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#translate-the-strings" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Translate the Strings</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#convert-po-files-to-mo-files" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Convert .po Files to .mo Files</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#select-and-load-mo-files-at-run-time" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Select and Load .mo Files at Run-Time</span> </a> <ul class="isMobile astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#select-and-load-translations-with-rust" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Select and Load Translations with Rust</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#select-and-load-translations-with-c" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Select and Load Translations with C++</span> </a>  </li> </ul>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#previewing-translations-with-slint-viewer" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Previewing Translations with slint-viewer</span> </a>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#overview" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#annotating-translatable-strings" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Annotating Translatable Strings</span> </a> <ul class="astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#formatting" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Formatting</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#plurals" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Plurals</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#context" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Context</span> </a>  </li> </ul>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#extract-translatable-strings" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Extract Translatable Strings</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#translate-the-strings" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Translate the Strings</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#convert-po-files-to-mo-files" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Convert .po Files to .mo Files</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#select-and-load-mo-files-at-run-time" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Select and Load .mo Files at Run-Time</span> </a> <ul class="astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#select-and-load-translations-with-rust" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Select and Load Translations with Rust</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#select-and-load-translations-with-c" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Select and Load Translations with C++</span> </a>  </li> </ul>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#previewing-translations-with-slint-viewer" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Previewing Translations with slint-viewer</span> </a>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">Translations</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <p>Slint’s translation infrastructure makes your application available in different languages.</p>
+<h2 id="overview">Overview</h2>
+<p>:::tip Prerequisite</p>
+<p>Install the <code dir="auto">slint-tr-extractor</code> tool to extract translatable strings from <code dir="auto">.slint</code> files:</p>
+<div class="expressive-code"><link rel="stylesheet" href="/tng/_astro/ec.x2uya.css"><script type="module" src="/tng/_astro/ec.8zarh.js"></script><figure class="frame is-terminal not-content"><figcaption class="header"><span class="title"></span><span class="sr-only">Terminal window</span></figcaption><pre data-language="sh"><code><div class="ec-line"><div class="code"><span style="--0:#DCDCAA;--1:#795E26">cargo</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#CE9178;--1:#A31515">install</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#CE9178;--1:#A31515">slint-tr-extractor</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="cargo install slint-tr-extractor"><div></div></button></div></figure></div>
+<p>:::</p>
+<p>Complete the following steps to translate your application:</p>
+<ol>
+<li>Identify all user visible strings that need translation and annotate them with the <code dir="auto">@tr()</code> macro.</li>
+<li>Extract annotated strings by running the <code dir="auto">slint-tr-extractor</code> tool and generate <code dir="auto">.pot</code> files.</li>
+<li>Use a third-party tool to translate the strings into a target language, as <code dir="auto">.po</code> files.</li>
+<li>Use <a href="https://www.gnu.org/software/gettext/manual/gettext.html">gettext’s <code dir="auto">msgfmt</code></a> tool to convert <code dir="auto">.po</code> files into run-time loadable <code dir="auto">.mo</code> files.</li>
+<li>Use Slint’s API to select and load <code dir="auto">.mo</code> files at run-time, based on the user’s locale settings.</li>
+</ol>
+<p>At this point, all strings marked for translation are automatically rendered in the target language.</p>
+<p>:::{note}</p>
+<p>Support for translations via gettext is currently not supported on Windows, see <a href="https://github.com/slint-ui/slint/issues/3307">Add support for translations on Windows #3307</a>.</p>
+<p>:::</p>
+<h2 id="annotating-translatable-strings">Annotating Translatable Strings</h2>
+<p>Use the <code dir="auto">@tr</code> macro in <code dir="auto">.slint</code> files to mark that a string for translation. This macro
+takes care of both the translation and the formatting by replacing <code dir="auto">{}</code> placeholders.</p>
+<p>The first argument must be a plain string literal, followed by the arguments:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint,no-preview"><code><div class="ec-line"><div class="code"><span style="--0:#cccccc;--1:#3b3b3b">export component Example {</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">property &#x3C;string> name;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">Text {</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">        </span></span><span style="--0:#cccccc;--1:#3b3b3b">text: @tr("Hello, {}", name);</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#cccccc;--1:#3b3b3b">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="export component Example {    property <string> name;    Text {        text: @tr(&#x22;Hello, {}&#x22;, name);    }}"><div></div></button></div></figure></div>
+<h3 id="formatting">Formatting</h3>
+<p>The <code dir="auto">@tr</code> macro replaces each <code dir="auto">{}</code> placeholder in the string marked for translation with the corresponding argument.
+It’s also possible to re-order the arguments using <code dir="auto">{0}</code>, <code dir="auto">{1}</code>, and so on. Translators can use ordered
+placeholders even if the original string did not.</p>
+<p>You can include the literal characters <code dir="auto">{</code> and <code dir="auto">}</code> in a string by preceding them with the same character.
+For example, escaping the <code dir="auto">{</code> character with <code dir="auto">{{</code> and the <code dir="auto">}</code> character with <code dir="auto">}}</code>.</p>
+<h3 id="plurals">Plurals</h3>
+<p>Use plural formatting when the translation of text involving a variable number of elements should change
+depending on whether there is a single element or multiple.</p>
+<p>Given <code dir="auto">count</code> and an expression that represents the count of something, form the plural with the <code dir="auto">|</code> and <code dir="auto">%</code> symbols like so:</p>
+<p><code dir="auto">@tr("I have {n} item" | "I have {n} items" % count)</code>.</p>
+<p>Use <code dir="auto">{n}</code> in the format string to access the expression after the <code dir="auto">%</code>.</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint,no-preview"><code><div class="ec-line"><div class="code"><span style="--0:#cccccc;--1:#3b3b3b">export component Example inherits Text {</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">in property &#x3C;int> score;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">in property &#x3C;int> name;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">text: @tr("Hello {0}, you have one point" | "Hello {0}, you have {n} points" % score, name);</span></div></div><div class="ec-line"><div class="code"><span style="--0:#cccccc;--1:#3b3b3b">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="export component Example inherits Text {    in property <int> score;    in property <int> name;    text: @tr(&#x22;Hello {0}, you have one point&#x22; | &#x22;Hello {0}, you have {n} points&#x22; % score, name);}"><div></div></button></div></figure></div>
+<h3 id="context">Context</h3>
+<p>Disambiguate translations for strings with the same source text but different contextual meanings by adding a context
+to the <code dir="auto">@tr(...)</code> macro using the <code dir="auto">"..." =></code> syntax.</p>
+<p>Use the context to provide additional context information to translators, ensuring accurate and contextually appropriate translations.</p>
+<p>The context must be a plain string literal and it appears as <code dir="auto">msgctx</code> in the <code dir="auto">.pot</code> files. If not specified, the context defaults
+to the name of the surrounding component.</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint,no-preview"><code><div class="ec-line"><div class="code"><span style="--0:#cccccc;--1:#3b3b3b">export component MenuItem {</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">property &#x3C;string> name : @tr("Default Name"); // Default: `MenuItem` will be the context.</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#cccccc;--1:#3b3b3b">    </span></span><span style="--0:#cccccc;--1:#3b3b3b">property &#x3C;string> tooltip : @tr("ToolTip" => "ToolTip for {}", name); // Specified: The context will be `ToolTip`.</span></div></div><div class="ec-line"><div class="code"><span style="--0:#cccccc;--1:#3b3b3b">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="export component MenuItem {    property <string> name : @tr(&#x22;Default Name&#x22;); // Default: &#x60;MenuItem&#x60; will be the context.    property <string> tooltip : @tr(&#x22;ToolTip&#x22; => &#x22;ToolTip for {}&#x22;, name); // Specified: The context will be &#x60;ToolTip&#x60;.}"><div></div></button></div></figure></div>
+<h2 id="extract-translatable-strings">Extract Translatable Strings</h2>
+<p>Use the <code dir="auto">slint-tr-extractor</code> tool to generate a <code dir="auto">.pot</code> file from <code dir="auto">.slint</code> files.
+You can run it like so:</p>
+<div class="expressive-code"><figure class="frame is-terminal not-content"><figcaption class="header"><span class="title"></span><span class="sr-only">Terminal window</span></figcaption><pre data-language="sh"><code><div class="ec-line"><div class="code"><span style="--0:#DCDCAA;--1:#795E26">find</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">-name</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#D7BA7D;--1:#D40000">\*</span><span style="--0:#CE9178;--1:#A31515">.slint</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#D4D4D4;--1:#000000">|</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#DCDCAA;--1:#795E26">xargs</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#CE9178;--1:#A31515">slint-tr-extractor</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">-o</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#CE9178;--1:#A31515">MY_PROJECT.pot</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="find -name \*.slint | xargs slint-tr-extractor -o MY_PROJECT.pot"><div></div></button></div></figure></div>
+<p>This creates a file called <code dir="auto">MY_PROJECT.pot</code>. Replace “MY_PROJECT” with your actual project name.
+To learn how the project name affects the lookup of translations, read the sections below.</p>
+<div><p><code dir="auto">.pot</code> files are <a href="https://www.gnu.org/software/gettext/">Gettext</a> template files.</p></div>
+<h2 id="translate-the-strings">Translate the Strings</h2>
+<p>Start a new translation by creating a <code dir="auto">.po</code> file from a <code dir="auto">.pot</code> file. Both file formats are identical.
+You can either copy the file manually or use a tool like Gettext’s <code dir="auto">msginit</code> to start a new <code dir="auto">.po</code> file.</p>
+<p>The <code dir="auto">.po</code> file contains the strings in a target language.</p>
+<p><code dir="auto">.po</code> and <code dir="auto">.pot</code> files are plain text files that you can edit with a text editor. We recommend
+using a dedicated translation tool for working with them, such as the following:</p>
+<ul>
+<li><a href="https://poedit.net/">poedit</a></li>
+<li><a href="https://omegat.org/">OmegaT</a></li>
+<li><a href="https://userbase.kde.org/Lokalize">Lokalize</a></li>
+<li><a href="https://www.transifex.com/">Transifex</a> (web interface)</li>
+</ul>
+<h2 id="convert-po-files-to-mo-files">Convert <code dir="auto">.po</code> Files to <code dir="auto">.mo</code> Files</h2>
+<p>Convert the human readable <code dir="auto">.po</code> files into machine-friendly <code dir="auto">.mo</code> files, which are a binary representation
+that is more efficient to read by code.</p>
+<p>Use <a href="https://www.gnu.org/software/gettext/">Gettext</a>’s <code dir="auto">msgfmt</code> command line tool to convert <code dir="auto">.po</code> files to <code dir="auto">.mo</code>
+files:</p>
+<div class="expressive-code"><figure class="frame is-terminal not-content"><figcaption class="header"><span class="title"></span><span class="sr-only">Terminal window</span></figcaption><pre data-language="sh"><code><div class="ec-line"><div class="code"><span style="--0:#DCDCAA;--1:#795E26">msgfmt</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#CE9178;--1:#A31515">translation.po</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">-o</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#CE9178;--1:#A31515">translation.mo</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="msgfmt translation.po -o translation.mo"><div></div></button></div></figure></div>
+<h2 id="select-and-load-mo-files-at-run-time">Select and Load <code dir="auto">.mo</code> Files at Run-Time</h2>
+<p>Slint uses the <a href="https://www.gnu.org/software/gettext/">Gettext</a> library to load translations at run-time.
+Gettext expects translation files - called message catalogs - in following directory hierarchy:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="plaintext"><code><div class="ec-line"><div class="code"><span style="--0:#cccccc;--1:#3b3b3b">dir_name/locale/LC_MESSAGES/domain_name.mo</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="dir_name/locale/LC_MESSAGES/domain_name.mo"><div></div></button></div></figure></div>
+<ul>
+<li>
+<p><code dir="auto">dir_name</code>: the base directory that you can choose freely.</p>
+</li>
+<li>
+<p><code dir="auto">locale</code>: The name of the user’s locale for a given target language, such as <code dir="auto">fr</code> for French, or <code dir="auto">de</code> for German.</p>
+<p>The locale is typically determined using environment variables that your operating system sets.</p>
+</li>
+<li>
+<p><code dir="auto">domain_name</code>: Selected based on the programming language you’re using Slint with.</p>
+</li>
+</ul>
+<div><p>Read the <a href="https://www.gnu.org/software/gettext/manual/gettext.html#Locating-Catalogs">Gettext documentation</a> for more information.</p></div>
+<h3 id="select-and-load-translations-with-rust">Select and Load Translations with Rust</h3>
+<p>First, enable the <code dir="auto">gettext</code> feature of the <code dir="auto">slint</code> crate in the <code dir="auto">features</code> section to gain access to the translations API
+and activate run-time translation support.</p>
+<p>Next, use the <code dir="auto">slint::init_translations!</code> macro to specify the base location of your <code dir="auto">.mo</code> files. This is
+the <code dir="auto">dir_name</code> in the scheme of the previous section. Slint expects the <code dir="auto">.mo</code> files to be in the
+corresponding sub-directories and their file name - <code dir="auto">domain_name</code> - must match the package name
+in your <code dir="auto">Cargo.toml</code>. This is often the same as the crate name.</p>
+<p>For example:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="rust"><code><div class="ec-line"><div class="code"><span style="--0:#4EC9B0;--1:#227188">slint</span><span style="--0:#D4D4D4;--1:#000000">::</span><span style="--0:#DCDCAA;--1:#795E26">init_translations!</span><span style="--0:#CCCCCC;--1:#3B3B3B">(</span><span style="--0:#DCDCAA;--1:#795E26">concat!</span><span style="--0:#CCCCCC;--1:#3B3B3B">(</span><span style="--0:#DCDCAA;--1:#795E26">env!</span><span style="--0:#CCCCCC;--1:#3B3B3B">(</span><span style="--0:#CE9178;--1:#A31515">"CARGO_MANIFEST_DIR"</span><span style="--0:#CCCCCC;--1:#3B3B3B">), </span><span style="--0:#CE9178;--1:#A31515">"/lang/"</span><span style="--0:#CCCCCC;--1:#3B3B3B">));</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="slint::init_translations!(concat!(env!(&#x22;CARGO_MANIFEST_DIR&#x22;), &#x22;/lang/&#x22;));"><div></div></button></div></figure></div>
+<p>For example, if your <code dir="auto">Cargo.toml</code> contains the following lines and the user’s locale is <code dir="auto">fr</code>:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="toml"><code><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">[package]</span></div></div><div class="ec-line"><div class="code"><span style="--0:#9CDCFE;--1:#001080">name</span><span style="--0:#CCCCCC;--1:#3B3B3B"> = </span><span style="--0:#CE9178;--1:#A31515">"gallery"</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="[package]name = &#x22;gallery&#x22;"><div></div></button></div></figure></div>
+<p>With these settings, Slint looks for <code dir="auto">gallery.mo</code> in the <code dir="auto">lang/fr/LC_MESSAGES/gallery.mo</code>.</p>
+<h3 id="select-and-load-translations-with-c">Select and Load Translations with C++</h3>
+<p>First, enable the <code dir="auto">SLINT_FEATURE_GETTEXT</code> cmake option when compiling Slint to gain access to
+the translations API and activate run-time translation support.</p>
+<p>In C++ applications using cmake, the <code dir="auto">domain_name</code> is the CMake target name.</p>
+<p>Next, bind the text domain to a path using the standard gettext library.</p>
+<p>To do so, add this in your <code dir="auto">CMakeLists.txt</code> file:</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="cmake"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">find_package</span><span style="--0:#CCCCCC;--1:#3B3B3B">(Intl)</span></div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">if</span><span style="--0:#CCCCCC;--1:#3B3B3B">(Intl_FOUND)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#569CD6;--1:#0000FF">    </span></span><span style="--0:#569CD6;--1:#0000FF">target_compile_definitions</span><span style="--0:#CCCCCC;--1:#3B3B3B">(my_application PRIVATE HAVE_GETTEXT SRC_DIR=</span><span style="--0:#CE9178;--1:#A31515">"${CMAKE_CURRENT_SOURCE_DIR}"</span><span style="--0:#CCCCCC;--1:#3B3B3B">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#569CD6;--1:#0000FF">    </span></span><span style="--0:#569CD6;--1:#0000FF">target_link_libraries</span><span style="--0:#CCCCCC;--1:#3B3B3B">(my_application PRIVATE Intl::Intl)</span></div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">endif</span><span style="--0:#CCCCCC;--1:#3B3B3B">()</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="find_package(Intl)if(Intl_FOUND)    target_compile_definitions(my_application PRIVATE HAVE_GETTEXT SRC_DIR=&#x22;${CMAKE_CURRENT_SOURCE_DIR}&#x22;)    target_link_libraries(my_application PRIVATE Intl::Intl)endif()"><div></div></button></div></figure></div>
+<p>You can then setup the locale and the text domain</p>
+<div class="expressive-code"><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="c++"><code><div class="ec-line"><div class="code"><span style="--0:#C586C0;--1:#AC00D8">#ifdef</span><span style="--0:#569CD6;--1:#0000FF"> HAVE_GETTEXT</span></div></div><div class="ec-line"><div class="code"><span style="--0:#C586C0;--1:#AC00D8">#    include</span><span style="--0:#569CD6;--1:#0000FF"> </span><span style="--0:#CE9178;--1:#A31515">&#x3C;locale></span></div></div><div class="ec-line"><div class="code"><span style="--0:#C586C0;--1:#AC00D8">#    include</span><span style="--0:#569CD6;--1:#0000FF"> </span><span style="--0:#CE9178;--1:#A31515">&#x3C;libintl.h></span></div></div><div class="ec-line"><div class="code"><span style="--0:#C586C0;--1:#AC00D8">#endif</span></div></div><div class="ec-line"><div class="code">
+</div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">int</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#DCDCAA;--1:#795E26">main</span><span style="--0:#CCCCCC;--1:#3B3B3B">()</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">{</span></div></div><div class="ec-line"><div class="code"><span style="--0:#C586C0;--1:#AC00D8">#ifdef</span><span style="--0:#569CD6;--1:#0000FF"> HAVE_GETTEXT</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#DCDCAA;--1:#795E26">bindtextdomain</span><span style="--0:#CCCCCC;--1:#3B3B3B">(</span><span style="--0:#CE9178;--1:#A31515">"my_application"</span><span style="--0:#CCCCCC;--1:#3B3B3B">, SRC_DIR </span><span style="--0:#CE9178;--1:#A31515">"/lang/"</span><span style="--0:#CCCCCC;--1:#3B3B3B">);</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">std</span><span style="--0:#CCCCCC;--1:#3B3B3B">::</span><span style="--0:#4EC9B0;--1:#227188">locale</span><span style="--0:#CCCCCC;--1:#3B3B3B">::</span><span style="--0:#DCDCAA;--1:#795E26">global</span><span style="--0:#CCCCCC;--1:#3B3B3B">(</span><span style="--0:#4EC9B0;--1:#227188">std</span><span style="--0:#CCCCCC;--1:#3B3B3B">::</span><span style="--0:#DCDCAA;--1:#795E26">locale</span><span style="--0:#CCCCCC;--1:#3B3B3B">(</span><span style="--0:#CE9178;--1:#A31515">""</span><span style="--0:#CCCCCC;--1:#3B3B3B">));</span></div></div><div class="ec-line"><div class="code"><span style="--0:#C586C0;--1:#AC00D8">#endif</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#76A162;--1:#007A00">   </span></span><span style="--0:#76A162;--1:#007A00">//...</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="#ifdef HAVE_GETTEXT#    include <locale>#    include <libintl.h>#endifint main(){#ifdef HAVE_GETTEXT    bindtextdomain(&#x22;my_application&#x22;, SRC_DIR &#x22;/lang/&#x22;);    std::locale::global(std::locale(&#x22;&#x22;));#endif   //...}"><div></div></button></div></figure></div>
+<p>For example, if you’re using the above and the user’s locale is <code dir="auto">fr</code>,
+Slint looks for <code dir="auto">my_application.mo</code> in the <code dir="auto">lang/fr/LC_MESSAGES/</code> directory.</p>
+<h2 id="previewing-translations-with-slint-viewer">Previewing Translations with <code dir="auto">slint-viewer</code></h2>
+<p>:::tip Prerequisite</p>
+<p>Use <code dir="auto">slint-viewer</code> to preview translations when previewing <code dir="auto">.slint</code> files:</p>
+<div class="expressive-code"><figure class="frame is-terminal not-content"><figcaption class="header"><span class="title"></span><span class="sr-only">Terminal window</span></figcaption><pre data-language="sh"><code><div class="ec-line"><div class="code"><span style="--0:#DCDCAA;--1:#795E26">cargo</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#CE9178;--1:#A31515">install</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#CE9178;--1:#A31515">slint-viewer</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="cargo install slint-viewer"><div></div></button></div></figure></div>
+<p>:::</p>
+<ol>
+<li>Enable the <code dir="auto">gettext</code> feature when compiling <code dir="auto">slint-viewer</code>.</li>
+<li>Use the <code dir="auto">--translation-domain</code> and <code dir="auto">translation-dir</code> command line options to
+load translations and display them based on the current locale.</li>
+</ol> </div> <footer class="sl-flex astro-7fvjbusy"> <div class="meta sl-flex astro-7fvjbusy">   </div> <div class="pagination-links astro-s2mh7mvg" dir="ltr">   </div>   </footer>  </div> </div>   </main> </div> </div>  </div> </div>  </body></html>
\ No newline at end of file
diff --git a/snapshots/tng/guide/types/index.html b/snapshots/tng/guide/types/index.html
index 49c315363..45856f655 100644
--- a/snapshots/tng/guide/types/index.html
+++ b/snapshots/tng/guide/types/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/index.html b/snapshots/tng/index.html
index 1b07e4eec..2c6cc23cf 100644
--- a/snapshots/tng/index.html
+++ b/snapshots/tng/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header>  <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r">  <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">   <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="hero astro-m4kjxvyb"> <img src="/tng/_astro/slint-logo-square-dark.DwYyWyio_Z1GUxx5.webp" loading="eager" decoding="async" alt="Slint logo" class="light:sl-hidden astro-m4kjxvyb" width="400" height="400"> <img src="/tng/_astro/slint-logo-square-light.H4H1qsfM_ZFXv6a.webp" loading="eager" decoding="async" alt="Slint logo" class="dark:sl-hidden astro-m4kjxvyb" width="400" height="400">  <div class="sl-flex stack astro-m4kjxvyb"> <div class="sl-flex copy astro-m4kjxvyb"> <h1 id="_top" data-page-title class="astro-m4kjxvyb">Welcome</h1> <div class="tagline astro-m4kjxvyb">Get started building your product with Slint.</div> </div> <div class="sl-flex actions astro-m4kjxvyb"> <a class="sl-link-button not-content primary astro-m4kjxvyb astro-obdgipfn" href="/tng/getting-started/intro/">  Language Docs <svg aria-hidden="true" class="astro-obdgipfn astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.5rem;"><path d="M17.92 11.62a1.001 1.001 0 0 0-.21-.33l-5-5a1.003 1.003 0 1 0-1.42 1.42l3.3 3.29H7a1 1 0 0 0 0 2h7.59l-3.3 3.29a1.002 1.002 0 0 0 .325 1.639 1 1 0 0 0 1.095-.219l5-5a1 1 0 0 0 .21-.33 1 1 0 0 0 0-.76Z"/></svg>  </a>  </div> </div> </div>  <div class="sl-markdown-content"> <h2 id="api-reference">API Reference</h2>
+</script>   </div> </div> </header>  <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r">  <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">   <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="hero astro-m4kjxvyb"> <img src="/tng/_astro/slint-logo-square-dark.DwYyWyio_Z1GUxx5.webp" loading="eager" decoding="async" alt="Slint logo" class="light:sl-hidden astro-m4kjxvyb" width="400" height="400"> <img src="/tng/_astro/slint-logo-square-light.H4H1qsfM_ZFXv6a.webp" loading="eager" decoding="async" alt="Slint logo" class="dark:sl-hidden astro-m4kjxvyb" width="400" height="400">  <div class="sl-flex stack astro-m4kjxvyb"> <div class="sl-flex copy astro-m4kjxvyb"> <h1 id="_top" data-page-title class="astro-m4kjxvyb">Welcome</h1> <div class="tagline astro-m4kjxvyb">Get started building your product with Slint.</div> </div> <div class="sl-flex actions astro-m4kjxvyb"> <a class="sl-link-button not-content primary astro-m4kjxvyb astro-obdgipfn" href="/tng/overview/">  Language Docs <svg aria-hidden="true" class="astro-obdgipfn astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.5rem;"><path d="M17.92 11.62a1.001 1.001 0 0 0-.21-.33l-5-5a1.003 1.003 0 1 0-1.42 1.42l3.3 3.29H7a1 1 0 0 0 0 2h7.59l-3.3 3.29a1.002 1.002 0 0 0 .325 1.639 1 1 0 0 0 1.095-.219l5-5a1 1 0 0 0 .21-.33 1 1 0 0 0 0-.76Z"/></svg>  </a>  </div> </div> </div>  <div class="sl-markdown-content"> <h2 id="api-reference">API Reference</h2>
 <div class="card-grid astro-q6zci5ae"><article class="card sl-flex astro-pxlzet7z"> <p class="title sl-flex astro-pxlzet7z"> <svg aria-hidden="true" class="icon astro-pxlzet7z astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.333em;"><path d="M22 7.24a1 1 0 0 0-.29-.71l-4.24-4.24a1 1 0 0 0-1.1-.22 1 1 0 0 0-.32.22l-2.83 2.83L2.29 16.05a1 1 0 0 0-.29.71V21a1 1 0 0 0 1 1h4.24a1 1 0 0 0 .76-.29l10.87-10.93L21.71 8c.1-.1.17-.2.22-.33a1 1 0 0 0 0-.24v-.14l.07-.05ZM6.83 20H4v-2.83l9.93-9.93 2.83 2.83L6.83 20ZM18.17 8.66l-2.83-2.83 1.42-1.41 2.82 2.82-1.41 1.42Z"/></svg>  <span class="astro-pxlzet7z">Rust</span> </p> <div class="body astro-pxlzet7z"><p>Edit <code dir="auto">src/content/docs/index.mdx</code> to see this page change.</p></div> </article> <article class="card sl-flex astro-pxlzet7z"> <p class="title sl-flex astro-pxlzet7z"> <svg aria-hidden="true" class="icon astro-pxlzet7z astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.333em;"><path d="M20 8.94a1.3 1.3 0 0 0-.06-.27v-.09c-.05-.1-.11-.2-.19-.28l-6-6a1.07 1.07 0 0 0-.28-.19h-.09a.88.88 0 0 0-.33-.11H7a3 3 0 0 0-3 3v14a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3V8.94Zm-6-3.53L16.59 8H15a1 1 0 0 1-1-1V5.41ZM18 19a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h5v3a3 3 0 0 0 3 3h3v9Zm-4-5h-1v-1a1 1 0 0 0-2 0v1h-1a1 1 0 0 0 0 2h1v1a1 1 0 0 0 2 0v-1h1a1 1 0 0 0 0-2Z"/></svg>  <span class="astro-pxlzet7z">C++</span> </p> <div class="body astro-pxlzet7z"><p>Add Markdown or MDX files to <code dir="auto">src/content/docs</code> to create new pages.</p></div> </article> <article class="card sl-flex astro-pxlzet7z"> <p class="title sl-flex astro-pxlzet7z"> <svg aria-hidden="true" class="icon astro-pxlzet7z astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.333em;"><path d="m21.32 9.55-1.89-.63.89-1.78A1 1 0 0 0 20.13 6L18 3.87a1 1 0 0 0-1.15-.19l-1.78.89-.63-1.89A1 1 0 0 0 13.5 2h-3a1 1 0 0 0-.95.68l-.63 1.89-1.78-.89A1 1 0 0 0 6 3.87L3.87 6a1 1 0 0 0-.19 1.15l.89 1.78-1.89.63a1 1 0 0 0-.68.94v3a1 1 0 0 0 .68.95l1.89.63-.89 1.78A1 1 0 0 0 3.87 18L6 20.13a1 1 0 0 0 1.15.19l1.78-.89.63 1.89a1 1 0 0 0 .95.68h3a1 1 0 0 0 .95-.68l.63-1.89 1.78.89a1 1 0 0 0 1.13-.19L20.13 18a1 1 0 0 0 .19-1.15l-.89-1.78 1.89-.63a1 1 0 0 0 .68-.94v-3a1 1 0 0 0-.68-.95ZM20 12.78l-1.2.4A2 2 0 0 0 17.64 16l.57 1.14-1.1 1.1-1.11-.6a2 2 0 0 0-2.79 1.16l-.4 1.2h-1.59l-.4-1.2A2 2 0 0 0 8 17.64l-1.14.57-1.1-1.1.6-1.11a2 2 0 0 0-1.16-2.82l-1.2-.4v-1.56l1.2-.4A2 2 0 0 0 6.36 8l-.57-1.11 1.1-1.1L8 6.36a2 2 0 0 0 2.82-1.16l.4-1.2h1.56l.4 1.2A2 2 0 0 0 16 6.36l1.14-.57 1.1 1.1-.6 1.11a2 2 0 0 0 1.16 2.79l1.2.4v1.59ZM12 8a4 4 0 1 0 0 8 4 4 0 0 0 0-8Zm0 6a2 2 0 1 1 0-4 2 2 0 0 1 0 4Z"/></svg>  <span class="astro-pxlzet7z">TypeScript</span> </p> <div class="body astro-pxlzet7z"><p>Edit your <code dir="auto">sidebar</code> and other config in <code dir="auto">astro.config.mjs</code>.</p></div> </article> <article class="card sl-flex astro-pxlzet7z"> <p class="title sl-flex astro-pxlzet7z"> <svg aria-hidden="true" class="icon astro-pxlzet7z astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.333em;"><path d="M21.17 2.06A13.1 13.1 0 0 0 19 1.87a12.94 12.94 0 0 0-7 2.05 12.94 12.94 0 0 0-7-2 13.1 13.1 0 0 0-2.17.19 1 1 0 0 0-.83 1v12a1 1 0 0 0 1.17 1 10.9 10.9 0 0 1 8.25 1.91l.12.07h.11a.91.91 0 0 0 .7 0h.11l.12-.07A10.899 10.899 0 0 1 20.83 16 1 1 0 0 0 22 15V3a1 1 0 0 0-.83-.94ZM11 15.35a12.87 12.87 0 0 0-6-1.48H4v-10c.333-.02.667-.02 1 0a10.86 10.86 0 0 1 6 1.8v9.68Zm9-1.44h-1a12.87 12.87 0 0 0-6 1.48V5.67a10.86 10.86 0 0 1 6-1.8c.333-.02.667-.02 1 0v10.04Zm1.17 4.15a13.098 13.098 0 0 0-2.17-.19 12.94 12.94 0 0 0-7 2.05 12.94 12.94 0 0 0-7-2.05c-.727.003-1.453.066-2.17.19A1 1 0 0 0 2 19.21a1 1 0 0 0 1.17.79 10.9 10.9 0 0 1 8.25 1.91 1 1 0 0 0 1.16 0A10.9 10.9 0 0 1 20.83 20a1 1 0 0 0 1.17-.79 1 1 0 0 0-.83-1.15Z"/></svg>  <span class="astro-pxlzet7z">Python</span> </p> <div class="body astro-pxlzet7z"><p>Learn more in <a href="https://starlight.astro.build/">the Starlight Docs</a>.</p></div> </article> </div> 
 <h2 id="extras">Extras</h2>
 <div class="card-grid astro-q6zci5ae"><article class="card sl-flex astro-pxlzet7z"> <p class="title sl-flex astro-pxlzet7z"> <svg aria-hidden="true" class="icon astro-pxlzet7z astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.333em;"><path d="M22 7.24a1 1 0 0 0-.29-.71l-4.24-4.24a1 1 0 0 0-1.1-.22 1 1 0 0 0-.32.22l-2.83 2.83L2.29 16.05a1 1 0 0 0-.29.71V21a1 1 0 0 0 1 1h4.24a1 1 0 0 0 .76-.29l10.87-10.93L21.71 8c.1-.1.17-.2.22-.33a1 1 0 0 0 0-.24v-.14l.07-.05ZM6.83 20H4v-2.83l9.93-9.93 2.83 2.83L6.83 20ZM18.17 8.66l-2.83-2.83 1.42-1.41 2.82 2.82-1.41 1.42Z"/></svg>  <span class="astro-pxlzet7z">Update content</span> </p> <div class="body astro-pxlzet7z"><p>Edit <code dir="auto">src/content/docs/index.mdx</code> to see this page change.</p></div> </article> <article class="card sl-flex astro-pxlzet7z"> <p class="title sl-flex astro-pxlzet7z"> <svg aria-hidden="true" class="icon astro-pxlzet7z astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.333em;"><path d="M20 8.94a1.3 1.3 0 0 0-.06-.27v-.09c-.05-.1-.11-.2-.19-.28l-6-6a1.07 1.07 0 0 0-.28-.19h-.09a.88.88 0 0 0-.33-.11H7a3 3 0 0 0-3 3v14a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3V8.94Zm-6-3.53L16.59 8H15a1 1 0 0 1-1-1V5.41ZM18 19a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h5v3a3 3 0 0 0 3 3h3v9Zm-4-5h-1v-1a1 1 0 0 0-2 0v1h-1a1 1 0 0 0 0 2h1v1a1 1 0 0 0 2 0v-1h1a1 1 0 0 0 0-2Z"/></svg>  <span class="astro-pxlzet7z">Add new content</span> </p> <div class="body astro-pxlzet7z"><p>Add Markdown or MDX files to <code dir="auto">src/content/docs</code> to create new pages.</p></div> </article> <article class="card sl-flex astro-pxlzet7z"> <p class="title sl-flex astro-pxlzet7z"> <svg aria-hidden="true" class="icon astro-pxlzet7z astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.333em;"><path d="m21.32 9.55-1.89-.63.89-1.78A1 1 0 0 0 20.13 6L18 3.87a1 1 0 0 0-1.15-.19l-1.78.89-.63-1.89A1 1 0 0 0 13.5 2h-3a1 1 0 0 0-.95.68l-.63 1.89-1.78-.89A1 1 0 0 0 6 3.87L3.87 6a1 1 0 0 0-.19 1.15l.89 1.78-1.89.63a1 1 0 0 0-.68.94v3a1 1 0 0 0 .68.95l1.89.63-.89 1.78A1 1 0 0 0 3.87 18L6 20.13a1 1 0 0 0 1.15.19l1.78-.89.63 1.89a1 1 0 0 0 .95.68h3a1 1 0 0 0 .95-.68l.63-1.89 1.78.89a1 1 0 0 0 1.13-.19L20.13 18a1 1 0 0 0 .19-1.15l-.89-1.78 1.89-.63a1 1 0 0 0 .68-.94v-3a1 1 0 0 0-.68-.95ZM20 12.78l-1.2.4A2 2 0 0 0 17.64 16l.57 1.14-1.1 1.1-1.11-.6a2 2 0 0 0-2.79 1.16l-.4 1.2h-1.59l-.4-1.2A2 2 0 0 0 8 17.64l-1.14.57-1.1-1.1.6-1.11a2 2 0 0 0-1.16-2.82l-1.2-.4v-1.56l1.2-.4A2 2 0 0 0 6.36 8l-.57-1.11 1.1-1.1L8 6.36a2 2 0 0 0 2.82-1.16l.4-1.2h1.56l.4 1.2A2 2 0 0 0 16 6.36l1.14-.57 1.1 1.1-.6 1.11a2 2 0 0 0 1.16 2.79l1.2.4v1.59ZM12 8a4 4 0 1 0 0 8 4 4 0 0 0 0-8Zm0 6a2 2 0 1 1 0-4 2 2 0 0 1 0 4Z"/></svg>  <span class="astro-pxlzet7z">Configure your site</span> </p> <div class="body astro-pxlzet7z"><p>Edit your <code dir="auto">sidebar</code> and other config in <code dir="auto">astro.config.mjs</code>.</p></div> </article> <article class="card sl-flex astro-pxlzet7z"> <p class="title sl-flex astro-pxlzet7z"> <svg aria-hidden="true" class="icon astro-pxlzet7z astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.333em;"><path d="M21.17 2.06A13.1 13.1 0 0 0 19 1.87a12.94 12.94 0 0 0-7 2.05 12.94 12.94 0 0 0-7-2 13.1 13.1 0 0 0-2.17.19 1 1 0 0 0-.83 1v12a1 1 0 0 0 1.17 1 10.9 10.9 0 0 1 8.25 1.91l.12.07h.11a.91.91 0 0 0 .7 0h.11l.12-.07A10.899 10.899 0 0 1 20.83 16 1 1 0 0 0 22 15V3a1 1 0 0 0-.83-.94ZM11 15.35a12.87 12.87 0 0 0-6-1.48H4v-10c.333-.02.667-.02 1 0a10.86 10.86 0 0 1 6 1.8v9.68Zm9-1.44h-1a12.87 12.87 0 0 0-6 1.48V5.67a10.86 10.86 0 0 1 6-1.8c.333-.02.667-.02 1 0v10.04Zm1.17 4.15a13.098 13.098 0 0 0-2.17-.19 12.94 12.94 0 0 0-7 2.05 12.94 12.94 0 0 0-7-2.05c-.727.003-1.453.066-2.17.19A1 1 0 0 0 2 19.21a1 1 0 0 0 1.17.79 10.9 10.9 0 0 1 8.25 1.91 1 1 0 0 0 1.16 0A10.9 10.9 0 0 1 20.83 20a1 1 0 0 0 1.17-.79 1 1 0 0 0-.83-1.15Z"/></svg>  <span class="astro-pxlzet7z">Read the docs</span> </p> <div class="body astro-pxlzet7z"><p>Learn more in <a href="https://starlight.astro.build/">the Starlight Docs</a>.</p></div> </article> </div>  </div> <footer class="sl-flex astro-7fvjbusy"> <div class="meta sl-flex astro-7fvjbusy">   </div> <div class="pagination-links astro-s2mh7mvg" dir="ltr">   </div>   </footer>  </div> </div>  </main> </div> </div>  </div> </div>  </body></html>
\ No newline at end of file
diff --git a/snapshots/tng/overview/index.html b/snapshots/tng/overview/index.html
new file mode 100644
index 000000000..a327cad4b
--- /dev/null
+++ b/snapshots/tng/overview/index.html
@@ -0,0 +1,93 @@
+<!DOCTYPE html><html lang="en" dir="ltr" data-has-toc data-has-sidebar data-theme="dark" class="astro-qk6vovz3"> <head><meta charset="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><title>Slint Documentation Overview</title><link rel="canonical" href="https://snapshots.slint.dev/tng/overview/"/><link rel="sitemap" href="/tng/sitemap-index.xml"/><link rel="shortcut icon" href="/tng/favicon.svg" type="image/svg+xml"/><meta name="generator" content="Astro v4.16.10"/><meta name="generator" content="Starlight v0.28.6"/><meta property="og:title" content="Overview"/><meta property="og:type" content="article"/><meta property="og:url" content="https://snapshots.slint.dev/tng/overview/"/><meta property="og:locale" content="en"/><meta property="og:description"/><meta property="og:site_name" content=""/><meta name="twitter:card" content="summary_large_image"/><script>
+	window.StarlightThemeProvider = (() => {
+		const storedTheme =
+			typeof localStorage !== 'undefined' && localStorage.getItem('starlight-theme');
+		const theme =
+			storedTheme ||
+			(window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark');
+		document.documentElement.dataset.theme = theme === 'light' ? 'light' : 'dark';
+		return {
+			updatePickers(theme = storedTheme || 'auto') {
+				document.querySelectorAll('starlight-theme-select').forEach((picker) => {
+					const select = picker.querySelector('select');
+					if (select) select.value = theme;
+					/** @type {HTMLTemplateElement | null} */
+					const tmpl = document.querySelector(`#theme-icons`);
+					const newIcon = tmpl && tmpl.content.querySelector('.' + theme);
+					if (newIcon) {
+						const oldIcon = picker.querySelector('svg.label-icon');
+						if (oldIcon) {
+							oldIcon.replaceChildren(...newIcon.cloneNode(true).childNodes);
+						}
+					}
+				});
+			},
+		};
+	})();
+</script><template id="theme-icons"><svg aria-hidden="true" class="light astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M5 12a1 1 0 0 0-1-1H3a1 1 0 0 0 0 2h1a1 1 0 0 0 1-1Zm.64 5-.71.71a1 1 0 0 0 0 1.41 1 1 0 0 0 1.41 0l.71-.71A1 1 0 0 0 5.64 17ZM12 5a1 1 0 0 0 1-1V3a1 1 0 0 0-2 0v1a1 1 0 0 0 1 1Zm5.66 2.34a1 1 0 0 0 .7-.29l.71-.71a1 1 0 1 0-1.41-1.41l-.66.71a1 1 0 0 0 0 1.41 1 1 0 0 0 .66.29Zm-12-.29a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.71-.71a1.004 1.004 0 1 0-1.43 1.41l.73.71ZM21 11h-1a1 1 0 0 0 0 2h1a1 1 0 0 0 0-2Zm-2.64 6A1 1 0 0 0 17 18.36l.71.71a1 1 0 0 0 1.41 0 1 1 0 0 0 0-1.41l-.76-.66ZM12 6.5a5.5 5.5 0 1 0 5.5 5.5A5.51 5.51 0 0 0 12 6.5Zm0 9a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7Zm0 3.5a1 1 0 0 0-1 1v1a1 1 0 0 0 2 0v-1a1 1 0 0 0-1-1Z"/></svg> <svg aria-hidden="true" class="dark astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.64 13a1 1 0 0 0-1.05-.14 8.049 8.049 0 0 1-3.37.73 8.15 8.15 0 0 1-8.14-8.1 8.59 8.59 0 0 1 .25-2A1 1 0 0 0 8 2.36a10.14 10.14 0 1 0 14 11.69 1 1 0 0 0-.36-1.05Zm-9.5 6.69A8.14 8.14 0 0 1 7.08 5.22v.27a10.15 10.15 0 0 0 10.14 10.14 9.784 9.784 0 0 0 2.1-.22 8.11 8.11 0 0 1-7.18 4.32v-.04Z"/></svg> <svg aria-hidden="true" class="auto astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg> </template><link rel="stylesheet" href="/tng/_astro/index.Dw8nZVol.css">
+<link rel="stylesheet" href="/tng/_astro/markdown.BIW0eA3J.css">
+<style>:root{--sl-badge-default-border: var(--sl-color-accent);--sl-badge-default-bg: var(--sl-color-accent-low);--sl-badge-default-text: #fff;--sl-badge-note-border: var(--sl-color-blue);--sl-badge-note-bg: var(--sl-color-blue-low);--sl-badge-note-text: #fff;--sl-badge-danger-border: var(--sl-color-red);--sl-badge-danger-bg: var(--sl-color-red-low);--sl-badge-danger-text: #fff;--sl-badge-success-border: var(--sl-color-green);--sl-badge-success-bg: var(--sl-color-green-low);--sl-badge-success-text: #fff;--sl-badge-caution-border: var(--sl-color-orange);--sl-badge-caution-bg: var(--sl-color-orange-low);--sl-badge-caution-text: #fff;--sl-badge-tip-border: var(--sl-color-purple);--sl-badge-tip-bg: var(--sl-color-purple-low);--sl-badge-tip-text: #fff}[data-theme=light]:root{--sl-badge-default-bg: var(--sl-color-accent-high);--sl-badge-note-bg: var(--sl-color-blue-high);--sl-badge-danger-bg: var(--sl-color-red-high);--sl-badge-success-bg: var(--sl-color-green-high);--sl-badge-caution-bg: var(--sl-color-orange-high);--sl-badge-tip-bg: var(--sl-color-purple-high)}.sl-badge:where(.astro-sudhlwkh){display:inline-block;border:1px solid var(--sl-color-border-badge);border-radius:.25rem;font-family:var(--sl-font-system-mono);line-height:normal;color:var(--sl-color-text-badge);background-color:var(--sl-color-bg-badge);overflow-wrap:anywhere}.sidebar-content .sl-badge:where(.astro-sudhlwkh){line-height:1;font-size:var(--sl-text-xs);padding:.125rem .375rem}.sidebar-content a[aria-current=page]>.sl-badge:where(.astro-sudhlwkh){--sl-color-bg-badge: transparent;--sl-color-border-badge: currentColor;color:inherit}.default:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-default-bg);--sl-color-border-badge: var(--sl-badge-default-border);--sl-color-text-badge: var(--sl-badge-default-text)}.note:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-note-bg);--sl-color-border-badge: var(--sl-badge-note-border);--sl-color-text-badge: var(--sl-badge-note-text)}.danger:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-danger-bg);--sl-color-border-badge: var(--sl-badge-danger-border);--sl-color-text-badge: var(--sl-badge-danger-text)}.success:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-success-bg);--sl-color-border-badge: var(--sl-badge-success-border);--sl-color-text-badge: var(--sl-badge-success-text)}.tip:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-tip-bg);--sl-color-border-badge: var(--sl-badge-tip-border);--sl-color-text-badge: var(--sl-badge-tip-text)}.caution:where(.astro-sudhlwkh){--sl-color-bg-badge: var(--sl-badge-caution-bg);--sl-color-border-badge: var(--sl-badge-caution-border);--sl-color-text-badge: var(--sl-badge-caution-text)}.small:where(.astro-sudhlwkh){font-size:var(--sl-text-xs);padding:.125rem .25rem}.medium:where(.astro-sudhlwkh){font-size:var(--sl-text-sm);padding:.175rem .35rem}.large:where(.astro-sudhlwkh){font-size:var(--sl-text-base);padding:.225rem .45rem}.sl-markdown-content :is(h1,h2,h3,h4,h5,h6) .sl-badge:where(.astro-sudhlwkh){vertical-align:middle}
+.card-grid:where(.astro-q6zci5ae){display:grid;gap:1rem}.card-grid:where(.astro-q6zci5ae)>*{margin-top:0!important}@media (min-width: 50rem){.card-grid:where(.astro-q6zci5ae){grid-template-columns:1fr 1fr;gap:1.5rem}.stagger:where(.astro-q6zci5ae){--stagger-height: 5rem;padding-bottom:var(--stagger-height)}.stagger:where(.astro-q6zci5ae)>*:nth-child(2n){transform:translateY(var(--stagger-height))}}
+.card:where(.astro-pxlzet7z){--sl-card-border: var(--sl-color-purple);--sl-card-bg: var(--sl-color-purple-low);border:1px solid var(--sl-color-gray-5);background-color:var(--sl-color-black);padding:clamp(1rem,calc(.125rem + 3vw),2.5rem);flex-direction:column;gap:clamp(.5rem,calc(.125rem + 1vw),1rem)}.card:where(.astro-pxlzet7z):nth-child(4n+1){--sl-card-border: var(--sl-color-orange);--sl-card-bg: var(--sl-color-orange-low)}.card:where(.astro-pxlzet7z):nth-child(4n+3){--sl-card-border: var(--sl-color-green);--sl-card-bg: var(--sl-color-green-low)}.card:where(.astro-pxlzet7z):nth-child(4n+4){--sl-card-border: var(--sl-color-red);--sl-card-bg: var(--sl-color-red-low)}.card:where(.astro-pxlzet7z):nth-child(4n+5){--sl-card-border: var(--sl-color-blue);--sl-card-bg: var(--sl-color-blue-low)}.title:where(.astro-pxlzet7z){font-weight:600;font-size:var(--sl-text-h4);color:var(--sl-color-white);line-height:var(--sl-line-height-headings);gap:1rem;align-items:center}.card:where(.astro-pxlzet7z) .icon:where(.astro-pxlzet7z){border:1px solid var(--sl-card-border);background-color:var(--sl-card-bg);padding:.2em;border-radius:.25rem}.card:where(.astro-pxlzet7z) .body:where(.astro-pxlzet7z){margin:0;font-size:clamp(var(--sl-text-sm),calc(.5rem + 1vw),var(--sl-text-body))}
+svg:where(.astro-bncqquy7){color:var(--sl-icon-color);font-size:var(--sl-icon-size, 1em);width:1em;height:1em}
+starlight-tabs:where(.astro-oqf2tref){display:block}.tablist-wrapper:where(.astro-oqf2tref){overflow-x:auto}:where(.astro-oqf2tref)[role=tablist]{display:flex;list-style:none;border-bottom:2px solid var(--sl-color-gray-5);padding:0}.tab:where(.astro-oqf2tref){margin-bottom:-2px}.tab:where(.astro-oqf2tref)>:where(.astro-oqf2tref)[role=tab]{display:flex;align-items:center;gap:.5rem;padding:0 1.25rem;text-decoration:none;border-bottom:2px solid var(--sl-color-gray-5);color:var(--sl-color-gray-3);outline-offset:var(--sl-outline-offset-inside);overflow-wrap:initial}.tab:where(.astro-oqf2tref) :where(.astro-oqf2tref)[role=tab][aria-selected=true]{color:var(--sl-color-white);border-color:var(--sl-color-text-accent);font-weight:600}.tablist-wrapper:where(.astro-oqf2tref)~[role=tabpanel]{margin-top:1rem}
+.sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
+starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
+.sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
+<script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
+	(() => {
+		const openBtn = document.querySelector('button[data-open-modal]');
+		const shortcut = openBtn?.querySelector('kbd');
+		if (!openBtn || !(shortcut instanceof HTMLElement)) return;
+		const platformKey = shortcut.querySelector('kbd');
+		if (platformKey && /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform)) {
+			platformKey.textContent = '⌘';
+			openBtn.setAttribute('aria-keyshortcuts', 'Meta+K');
+		}
+		shortcut.style.display = '';
+	})();
+</script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
+		(() => {
+			try {
+				if (!matchMedia('(min-width: 50em)').matches) return;
+				/** @type {HTMLElement | null} */
+				const target = document.querySelector('sl-sidebar-state-persist');
+				const state = JSON.parse(sessionStorage.getItem('sl-sidebar-state') || '0');
+				if (!target || !state || target.dataset.hash !== state.hash) return;
+				window._starlightScrollRestore = state.scroll;
+				customElements.define(
+					'sl-sidebar-restore',
+					class SidebarRestore extends HTMLElement {
+						connectedCallback() {
+							try {
+								const idx = parseInt(this.dataset.index || '');
+								const details = this.closest('details');
+								if (details && typeof state.open[idx] === 'boolean') details.open = state.open[idx];
+							} catch {}
+						}
+					}
+				);
+			} catch {}
+		})();
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" aria-current="page" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+		(() => {
+			const scroller = document.getElementById('starlight__sidebar');
+			if (!window._starlightScrollRestore || !scroller) return;
+			scroller.scrollTop = window._starlightScrollRestore;
+			delete window._starlightScrollRestore;
+		})();
+	</script> </sl-sidebar-state-persist>  <div class="md:sl-hidden"> <div class="mobile-preferences sl-flex astro-qyfhjkv4"> <div class="sl-flex social-icons astro-qyfhjkv4"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
+	StarlightThemeProvider.updatePickers();
+</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#more-resources" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">More resources</span> </a>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#more-resources" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">More resources</span> </a>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">Overview</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <img src="/tng/_astro/slint-logo-square-dark.DwYyWyio_PgUok.webp" class="light:sl-hidden" loading="lazy" alt="Slint logo" width="250" height="250" decoding="async">
+<img src="/tng/_astro/slint-logo-square-light.H4H1qsfM_Z2spL2E.webp" class="dark:sl-hidden" loading="lazy" alt="Slint logo" width="250" height="250" decoding="async">
+<p>Slint is a toolkit that can be used to build user interfaces for embedded devices, mobile and desktop applications.</p>
+<a class="sl-link-button not-content primary astro-obdgipfn" href="/tng/getting-started/intro">  Get started  </a> 
+<a class="sl-link-button not-content secondary astro-obdgipfn" href="/tng/tutorial/quickstart">  <p>Tutorial</p>  </a> 
+<a class="sl-link-button not-content secondary astro-obdgipfn" href="/tng/elements/rectangle">  <p>Element Reference</p>  </a> 
+<h2 id="more-resources">More resources</h2>
+<img src="/tng/_astro/mattermost-logo-light.DpTp-7cz_9zQW5.svg" class="light:sl-hidden" loading="lazy" alt="Mattermost logo" width="50" height="50" decoding="async">
+<img src="/tng/_astro/mattermost-logo-dark.ButNiD4U_Wo44T.svg" class="dark:sl-hidden" loading="lazy" alt="Mattermost logo" width="50" height="50" decoding="async">
+<p>As a first step please join our community on <a href="https://chat.slint.dev/">Mattermost</a>. This is a great place to ask questions and get help from other Slint users.</p> </div> <footer class="sl-flex astro-7fvjbusy"> <div class="meta sl-flex astro-7fvjbusy">   </div> <div class="pagination-links astro-s2mh7mvg" dir="ltr">  <a href="/tng/getting-started/intro" rel="next" class="astro-s2mh7mvg"> <svg aria-hidden="true" class="astro-s2mh7mvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.5rem;"><path d="M17.92 11.62a1.001 1.001 0 0 0-.21-.33l-5-5a1.003 1.003 0 1 0-1.42 1.42l3.3 3.29H7a1 1 0 0 0 0 2h7.59l-3.3 3.29a1.002 1.002 0 0 0 .325 1.639 1 1 0 0 0 1.095-.219l5-5a1 1 0 0 0 .21-.33 1 1 0 0 0 0-.76Z"/></svg>  <span class="astro-s2mh7mvg"> Next <br class="astro-s2mh7mvg"> <span class="link-title astro-s2mh7mvg">Welcome</span> </span> </a> </div>   </footer>  </div> </div>   </main> </div> </div>  </div> </div>  </body></html>
\ No newline at end of file
diff --git a/snapshots/tng/pagefind/fragment/en_19213a8.pf_fragment b/snapshots/tng/pagefind/fragment/en_19213a8.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..7c6c39470cb4804b9f0a1294838acb3bf9741191
GIT binary patch
literal 688
zcmV;h0#E%PiwFP!00002|7}#wY8x>SewATQ4Q%WNN)PU-hlJ$PLSqP}DMpcIcSW?4
zkVbJFW9V!2_4*{8(K?Nt^fs&c+3%b0lcMUev)-(XHru8o*DRWOU#!7-7d+*8(>9s|
z^u(D9j^I*x<E-yzaPDyAM21}S04l>09|<^JgDW2kfmR+8dV>k*IjfutYtSWA80`~}
z0vZrhjHr_G8X<J`q&CoyLg@!Ew(F255yTWCCbF1ku;j9rZw{HwBN|v+8bBDFw*S!8
z&rXfjZQAK0+b67u>em`=KQKc6kERMh55Z1wqyS1rDNTDq6?mwHStmq4gR73mZT9%{
z5j30qpI^TTazt%Ai>9re20K+8;}Qh$pj?q!KTR!(xqBl&x?z!cX*jK1mL)8nsU1z3
zC{DYnA_|X;{uOkUn0sLf6j{xZY#>^F&kRe1E`@P|u*rlYq~iU7PL3PM1|dvLDzl<F
zKnywCJBP9q>$NKe_ag6MFs)4}iP2`;bMxoJG>ja>9nXhlD!AOl2|c`<5p^f+n{yqU
zW1$#EEzu{y^w@1*Bl^Scz}++W9!m9MMrq<<hrh0F5pH&jA+biJsP1|3d~(~&=Hq5H
zHLavcP~A4dNx>}hg&^pxLs`2Os+m&JOj^cX*R&2}<cf5-AKGhFT{x<H%r8e(N3l-t
z!d(?eJt*sxtXQOEJ0AFaQvK+1TyPOSsxdk|BJw3rxK=)&e#5>vl_n~mxVDxE&fvvm
z=TkGI9oREWX79r7{|vX_*)kbqw2Z5-!M5IF$z38}d$<Y78OiQo$8XCzB(u_Na(-UU
zK7ME$-XUSi&0@Q2n-NKI)Q}~Iuiu}B3;4Adf>i(5Hv6l=Wy2XywuYk>g~+i$c+=iC
WE=)FV7VmdIcYgt3ZVl!O1pojnHb>b2

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_2ed3e82.pf_fragment b/snapshots/tng/pagefind/fragment/en_2182992.pf_fragment
similarity index 81%
rename from snapshots/tng/pagefind/fragment/en_2ed3e82.pf_fragment
rename to snapshots/tng/pagefind/fragment/en_2182992.pf_fragment
index 72df0eabedfcc886b6281158dc00a846bf96453a..b40550c93f9ebf3b8543ca87dadeb43f06f86fd9 100644
GIT binary patch
delta 288
zcmV+*0pI?$4YUogo&|r1zGTjob~+pe+Dq|hxS#9gFyJ>>QZElS@A!k}8eghqV`(mO
zzUaSAICQ$t`zuVn4%SBs%G6)>Ih0mz5k)Lil4%bAx3dUyEW$qyvR!tN($n1OlAgIL
zTk~o7Gn(E#?{`d$8WUyv#=N%mdgJxl(!EjFlxQr`C2+7iTAP2M8(mj%e3jyOtr%|X
zUERr5x|6jo6Hiz3URTqizW}xMOQA6Dgx<Aqe*?R5quksOs2egI)FjgaU>gT@Oz+;^
zz05WZgtyunpmvrQrmJIjG`WA%tjCvRJ$mrqR%s7*Z<F|VJi0~VZQIwSJ{e7Jn)>9D
m)F+ei?NT4zCiNJ}*SAW2bo12jjqjfSe*Q1H?mSMC6aWBDzLtmp

delta 289
zcmV++0p9+!4Yduho&|qsE^@w}zfIU7-NOCFqbBk7L4e}(S9CVeil{L{1~TVLI~@)K
zccyqW+|TuL7>Y1h(m)J0|4}e#{ufZHWkeARm1LU3|LrWo9E<RegKU?*r1Ug*x};~W
z%GP`u{*0z~&-)z{qsBzpzA>+Dz211ewsddQH6<ELbO{{nj@ExB=tkF79ABk4UMq$h
zdslaImF{G%%f!>wyw}yV=r2HR{Zc5*JE3<i+~2@%+$c9U1S({PgPLSo0Bqx+j_KXI
zyO-Iff$&ya1Jus)!gO`)jwbhSn)UdStVa(X+$!zC?rjnuk4Lviylwls)F-3KO;ev-
nlKNyazFq30+oTyj`TAC=k8Ym&z46`i-_QRA(;G|)k`w>{_f41m

diff --git a/snapshots/tng/pagefind/fragment/en_22b12ae.pf_fragment b/snapshots/tng/pagefind/fragment/en_22b12ae.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..b30083411fc8aaef3c23590f941fdd33fa23e157
GIT binary patch
literal 1546
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

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_279378d.pf_fragment b/snapshots/tng/pagefind/fragment/en_279378d.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..b40510a8fb306614afb98d9212b3869950a0cf50
GIT binary patch
literal 919
zcmV;I18DpoiwFP!00002|GiaBi{nNR{VRpewmiEK5;WwH2^+{EIb?SUAsc4fQrT*@
z-7UIXwuLdw-v}gsZhlE#wLZtpVNW?2Wa)L)dsVNh8@1=1w$)=*R+p^xCM&YdzSR|P
zcG~bJTV<uQk!{3>4>i;0JQ!``XZi`BbNa)zbn-efwShh13;UfaIpC2Z@b3jpM%jIf
zRHST0K^?i0?~)<VNyj=t`^dy+qzl^FoZhLj9$yQXDj|zA&N4YqfsgE!q0${1ys|Om
z1d@RlZ*ZnG$|E&J&p5UtHhk#8KhCh7^M^!ZtAY*!OEH3updxIOlAJywI$*#$+P2zM
z)VbD^J6ZC)ZiCu_XW%FiKK@KnJ?~8DOI0c>g(4PV1F>o*ORcS>ilAfF0h9v@HqsRi
z$~xrs^NE}u*tiqv9(h)W#_&YGS0*(dB^QfizjP06j7c0~O41LgJzW4X&KI;bs{C?K
zn+@f8PFF;4oR2R8{LnP>>EGcaP`Oa!dB+~g)+b%Xx}djrcg^{J@xErguVX=P`VYTx
z8Q~BxztGDgH^40z?Y%>p3fiNa_8z<@9Tz$mclRBB6rrS`Pg%{zxKG&)EJ4l%eUpNY
z*pu_7>akaPK%wU&Qo>%XIB99OL9_s76#^1(#I>H<7o_nOZM!~DKE^Y_^~Qm%#eP%H
zxz4abJUN)EQC?xxX8*n$W7n7|)Ymoaqvo)pQ>|gKZt$E6LGLXcm1!l7OJg$GMQz=Y
z2Mp{&A$o21V%-2ik)EIaNp*aF`d3^pEO*+6*+I`we}`1YkwQ1yJqaB0gR1tD7fuK=
z;*iiU2vmTD9pv?8SYV)qr3Ib%TE5LX<!^^UY8dsGn$>6kkLnNV%MeYL(|TG?$fnAu
zk36$X<F@FO=$C`V_Y^uC)%mLi=YJTL)Ci&Vm99^wzQMo1POhKkLF``?#Ra>Duk<S_
zGx$q39*c=I)^{b%+-dgcA<*>REi0H7Zt8qlN*iS<_R9^**8Li<Qq{4NymR6J2o9sa
zT#H^E96UB|KlENL_g-MLyE#<0sF<CO<b-))dmDOqxrqDf+5R3$43iqTk-c18GU~%z
z!S~6!y`FR}<hU_W((19qmcpg^_PcLa8SXB~30ZNuuCfD1g{Lg)X!x~TH3LZ5vUYOf
t&r3E?0<?aE=(@twV{{FkrHQYGSY^hQO0KS~xV!#!{SW=k(#_}x000v1%Z>m5

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_2d97661.pf_fragment b/snapshots/tng/pagefind/fragment/en_2d97661.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..7a889de25f70aa0bd9636e4a1ddec271e0483e0e
GIT binary patch
literal 1288
zcmV+j1^4<NiwFP!00002|IJq0ZsRr({gr|G(#2Zx=Du-W+GhKZV%sb>DHd(F2xy76
zh)|+HQn6hlK!2mZ*DvWAQnuu56Qo@fC=3G<$vJao=FCuyn9G@}i<=@Z)=6u1GD*h1
z^~Nfp$Ca#%UEO%4<v1B7xv9OZJ&t@IHs~4~8GTT`BwtE$w^B=QYRXL^N!8S7k;@VG
zlq2V5L)w^IN5Y5WGi9A8m{b5IGYgAzQ3VT0(K-3x<HG;>`yVc>-znD$P19ECLe+Dc
zYLnk$2dE(El=F_kL``j7NUK+TXr{E51zDMUQO~ucsmO2V*5F9=reI5|LOL>fE4;LU
zFt`>42>{<o%Q!tia42#(6OK=`)(cf<^pk0+khvCC2H@V&z!)aShsefU<p`xwOQ{_#
z6tX68&I_$Kj2E0-LCzRt5d@H4$>B|P%S>fG_od@pUulIbmf{W=h+O#*mC|;(Y?kEO
z*-R}ny5?e3;#S6NhEhr46e9Kp6h#p^guSXk_ATW|W+6T3)1s6$tq`NgbMUR1>xwG1
zq&ophE)p)(YzF5b#7wy2UgRahfeRp48J(ME6;)ugHVY1|Qw@%^YAl*2#cE*|nG2C2
z9|*=u)>KFY6Krj8(g}0YX(kPtiDn!FQii9fS(YrEAT`YE{k9@&PQNcFs7tdvL+aGL
z^qaT7h7<bY;Pm*_o1-(jV6ni?nbziVLSF^-r0Ah9KPD_EH=edGYwG#O<i*(rz7fng
z3va!fZZ*E1(LH{0*%-USAM*MTGSc(!-q*w6)@&WB93f(z2i85LGf~Ey#*2!Kh2WZ_
z#?nDuo;0@v+7SI!L|yl(3ti6r7BjMG=zy$^C>-yF{#tA%#UNKNAjaGp7ABws4uH9p
zaHt^Vs29NGcn1QM|2N`@U02H}Fjc$IL1F9!zbt6<kF+jGw{<cG6h~0B4jMO$ni->m
z8Y@%$xiAI&tQrzFF9(cT#mdEe8PUZoHUt_TzTT?3U6QdJ*5%b`fC&<E=`CgkXLOs3
zVFOeZPPs`}R~Iol$Xz$xiBSmVF_?E|A?;Nuk&L_m<%}9$ad8FNr}RgwsPw*Zlkqs_
zvXFOU%+z@|{Zkf3y1f#Du(RKgko2<kv(QbOr5*ThmkmgyUw3Is--Xil)^DWqst#2R
zTNzW#y7|=B4O(t19EX9z!;|j=?saIH19cKp8S^uu(zUb|5Vx_$05AVtco{e_&%wgy
z^7}@(^8d>1{N+pf0d4=?6}@k9E1!qaznQa*HFGPfsM(w^4@%Q;0mo}NXxp}RK;8;F
z8;8wtwYovWYPD(MM%H{|#s-dK!j-J{?LExbH;^3*U4*M{FoH8MjGjKBRyP%{ZGo}*
zA3Di}og0q!^PS+EYGG_~lj9AaRR_m=qXaF5$>fsB`hJvD(hEE#UU@Bdzq?=?hA3A5
ziHL?bB(A0n%8k(cU3ZmRiI_^W{T_=SX?#2ZA5rI}VRFB$lWxwl|2>8&@O0x%gJ+L9
z_X*q03{NJn?ngs&v9b1In(iI-_T7xzvEAQ0eaiZ{w+^#&*LMF&&nLZYn79vY_jYX^
zdWv@j2pD)$??mtbV*j}i$B#iA9X}W1<S~eo!>5w)x;Mj2*tI;}f6DT-w~UkIf$_l;
y#`~{&W1c?`Ob?$M^y|lhK0SIa#OWgt2hSG3FqmD4!@c`o@Bach<*NX54FCYS8F=9U

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_336e99f.pf_fragment b/snapshots/tng/pagefind/fragment/en_336e99f.pf_fragment
deleted file mode 100644
index 3ee93f5e75ab28e180ec02ccfc95d1f3992a8a1a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1496
zcmV;}1t<C+iwFP!00002|HW6!a@#f({S^#X?TkcAa-1ges_9JIMHU&y(=M8h4UrIq
z8YEZ%v@B~hlaJ`8zn3rRxgaQ#dU}#YR}z4G&wW2w@=VNSk=~_Ax{fNNqG@y?l*mQl
z>_ui|s`yG*?jjmQi7p(jLGcUj-~0QRU0kr+g|tjO@w`-mRaRK$7J}X1=;b{NSTWv9
zZ5&H<Ug`oj>}Rc+EEd8@XW8%2K`+^wEoJH!Q#Kim%BO3#5Hef1?Xi^$N?Y<o7TJ_t
z(bJ9Rz7dJzMFut2Y{rv^%;>5}r_6}-nr)6g&r~JoeRBq8C6v<3Q%IQ+qNt%fTvfnE
z_EE{gl{`J=twgJP#*38Q8}eIebSaFJ!hWOc##j5U`$jjNa}NxF+!wj&xF{U1VX}fj
z0daJF%&Q&aN-)BuO$swzFwQ8CdsK;j6vi@gAE=}e%vNR&PB_smSOP=f_n+v8al97V
zF|K4*2;kfzTw8n;g>}+Z4yot^>3IR86q^Co8R3$JNTINmsUQ+*fTeW89j+;h#eh|X
z64r)SE1yLTY&cA`Uq1h%<O8TgoW%o{%VJnZmubUt{xtNF2h~!W2gWlnSqCf$8$Q-m
z(#xk%IWcpqQcRf=MFyi&G3S*+#vot3jj6PV4SX^aZi#q#^R|Y|`m915@L6r859K3A
zqA;9!St<!5on|u)5esePGr9;@KGPpbp#+DmLbsYZZZhF;B@#K83FA-F)=^32d@c;-
zzZYPsc)SjCO?lV1a@v3nTcM{6Zm1ibPSJkgX}asvvc5a#(?Eu#qCEH7Q*u(CREevQ
zY8-B3%Y|0ryi<`zjIzoe^qhbBD%S-qhf2)dDT^99L&^9OLZ{1@kRe%|&QDQNX>M~d
z?jM^{<K2qaGsi>9wl)`H*$d*2#fr_)PVr{Rzo3SnS_+m|D6E<Atyn5CbTSW>${~14
zeX7wKh1*ft2Or4diRpQ_kiLBW*AknLQ&6yOS09B7O$9*@I;_y5t#Eb^0gbZC3)1;n
z7`^Q$m>fzb(y0{#TTEnMqhCNjq~eZxP=H#i39SxN|E{RRqR0aXw-$YrpxJkIKLd|_
zkR{?(lYAeOLr{>#L0!jQ*P_a2!jQ5=TWb+iW_F<~<y&jvO@1*{E&mi6%1q`RpElOv
zP#flBNhyRWgpT|dB@8w1Fj%yrHf?z6=R~iY((2J>^ldLun{^>E0#k!J#AG;I4JUQ;
z@X%fM0n@pxvj+=<7d0ilX^U91cNMCuz#N?$owHAobtz2{^bQ+anyH_n>u=mS4y<eS
zW`+GHSxA+l7j+$}Yrl=+M!9u8`msbf@dU(A(XB4o4Z)Lk8v<(hx0y9}2&0eP(uWL%
zI*GSS-D%O|j_5|@JKu)bdvw7)q2NT!g5*&gA7}3?4N4k)<2dXxr{nBPi05HQRJK_%
zNaLpFVsBqaxowAX`~h|*w7ej(b6!-Gr2l&sY@O6>bmzl-A4u;(OHmb%Fbo#baAJhY
zUF|2#KNs&v=pY}8CJg}44Z2|s9k%VLqnF0kN6Nz;XbhOx0kV!gKB%y+rFSrjzNxNW
zO$O0iDx|QDrt8fh%7x?j7h$_pqW94SR+;0&?T#z@8f(AOn*3=9=wr?m*~J~lexW;`
zbHhM5j^C9ZW)C;N{&tt8m(Nwa6tgmdaO{29o1n=b>nL;;fGx&^oZ{adCOQ6-J9bs`
zo2}GEG#zaQJ?=@v-7H(}WNoqb7uFu;_|@AT)XN>z7OK7I@L!G3@OKu*J*fU$2ldVC
zbEwT?xsTa-=^(xxAM;+bB^~nK{%X2|dQ{JV+CsG#UH&&``2Ehf2h!ZONR!L)IV8VT
z?n5=#U959f4SVU@zwF?=I;&H?neIbv@4INPk42CM@~|1!Em&`h?PDF!TJ)P1p+0o@
yewZBNLo;gm>O+U`c$~v(){_}7TK>z)>l1SO{Ov`D|MKnT&&_|>_B_R%5&!_M7~_Nh

diff --git a/snapshots/tng/pagefind/fragment/en_429a71b.pf_fragment b/snapshots/tng/pagefind/fragment/en_429a71b.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..dbd14b79a5353899a95c70ab85e6da5a1a1c3611
GIT binary patch
literal 415
zcmV;Q0bu?giwFP!00002|5Z^<kJB&^{VOA%(-bQ0r8guHrxgemA%svgi6@DP?aA8X
zma6K1XWX(tZ<EQq=l8MVM5Bwgvx7aGlDyfQEgvWy938i&F#|`TD7yaeXWPPO@1lUq
zfFR6%aRM@<z<?2Yf|AMV59o{YwtgkhdrBh?lwsrq6ne5&uPhy$E*l8kJ5PYI?(!nM
z0<Nof1B&CATX;_bSulyBo{DgC=v#Q_DX2R5L?b1N1GVtTi6Bwtl9aiHH&y27Qm%Mf
zVfBQW;3vBXdIJN8P@<C)aD+z`6&g583s18;yqcU6sk_yy{^|?!0?&o=RoPYYq~d1s
zD~yQ)u*_=t7E*PeTg~yv$#w&m8s)>TF{AVPQa1bZr7?j7bu!|_(|=Jb&IN6#mLhT5
zc9<pcHdpG6=ZQD@xnQD=#k90<kKayTPma5f(-&UaBlYVGL5IFpc+*sYMqkA^%v>dW
zKO4FQsW<cM3bHzN+JeqPzvNz%=UXji|LW4*VRtXspe=0vw(yVTzMVU+-NWU_<u{8y
JKB15T004@F&ocl3

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_4647333.pf_fragment b/snapshots/tng/pagefind/fragment/en_4647333.pf_fragment
deleted file mode 100644
index 3548daf1387cf1c8ffd7175a6275f127cfe9c0e5..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1943
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

diff --git a/snapshots/tng/pagefind/fragment/en_4742949.pf_fragment b/snapshots/tng/pagefind/fragment/en_4742949.pf_fragment
deleted file mode 100644
index f445440f5e8f09b2188abf23e6aa95d673306366..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 800
zcmV+*1K<1~iwFP!00002|J796P8%^0{gu%^wSp{!ODVh|P%Em^TM#@{Rb;%*uBq3v
zwZ{n;@$Vh)g(U&fNPXgM*Pe6c%#7z$B3Bb_vvDS~yCgW193&gLBGNV=coL3OwxKOK
z+(_0FiI$Wlj``SxKpT?6p$7pI?L6_Bs$ix-+o>i6HyD5ru25UR;6P$o2CL}?(88%8
zQm#Z#DV!DBgN{78Q-Yu}LaGQA{x|#y%9BRR*ER!I2!%2gOdOVgR44}{!#W{&<$TMP
z2c0RHX=9q;s3am=(R@Qi154qAnm~zD=3+v)6kbaYIH~`PuzBES)#(eIMO{z0Vqhaf
zU2~&6>xBtAIM+T110xEVMmWMur7&tc7%Dg)HAfdb2%LE+h5R~#&)SA-II*08b#*bv
zII{*t20C`Y@ktl)O!5>yFl8Tl6#L30fK@Z799}6&u};>{N<|ANRdVY|^%Kd^Dwt|f
z=ZN!*O{j$75)`~SB4^e{g`Uvbx3`?6K=k$4-9y*XS5e35@juIGPx+~%$>Kvn@M5ZJ
z!cK^`ucO>m#@0}GIX$@`Db$+Q*5C`5_Gtt^0x$g;r|?d8ec|l!;m5?Hsyti<udVVP
z4CY$$Q!lh>x)yYYiS8maZ+PF52}i|$c7rVXR15Jj16z@sutTJ5Ofz)ZSYn9YG~9o`
zo-mNFeR6Pjzn+we1b-!@$*8C1#duwEwPRtTwH<OQFP*NU-Nf}TZ=k+UyTIs?Wb=)&
z@X;8{2M-%?bvQ6OFDN~(&Z@zlydCe~e!tjF{WMQlim<Z4sO#rlqKqmVH!X&dI^(Y~
zVa4CXZ{b;?2BnC)l7r3r^*M^Ij>5O@9jd|9OCC|r_r!DN7~d^WijI-Q<zTyKX>DpA
zyS)Uv(_?FEn@8>}LGJd*+79QDyYooTPc&XU!dJp7^H}>l!Mha+c3vRZf4?HZ?h6FN
z?FEKn`(cc60S4{n4IVb{(J-H1&3XR4Wi#FE$#|U?fXfCt?17C3EMS+7bgRck<5)nh
eI?~OT8oIaYOo#u?u(gEY*Zp4_seU6`2><|l9feu|

diff --git a/snapshots/tng/pagefind/fragment/en_4e7dca2.pf_fragment b/snapshots/tng/pagefind/fragment/en_4e7dca2.pf_fragment
deleted file mode 100644
index 02a6e06f6ee8c14edb2b75288c6fb536f6556d4a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 244
zcmV<Q01N*giwFP!00002|8<YSYQr!LhF>M<oF-}6Dd)j1JB)RQu`!HitBILo8AoXf
zA@4rBZAuI6O+xxVee$xwopD-dr6(AIg&N9cFd9oAaBpxdAqPc{(Q%w@t#O>anmw-G
zPV?f}WlI;gM+#af8dBgXhn=yEp@({!bLfy|tbh$$yvvIK(?u&GZ8~@j&w3RQUEdNf
zTS=E)QwrI0pv8HmW%w(eoA-~Z3J3AE{;anAQjGZPAxcQ6T1rOW6QITJ^jf=4P#r75
u<YUcv;75v<lw?B=>T1q!D4T_1Q^H>oXWI2YH=ND<Gyel?5{M3t0RRAZ;BS5a

diff --git a/snapshots/tng/pagefind/fragment/en_568eb76.pf_fragment b/snapshots/tng/pagefind/fragment/en_568eb76.pf_fragment
deleted file mode 100644
index 02d9ee801fd9d4475ab2fb7f57df4bc61c02be32..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 510
zcmV<a0RjFWiwFP!00002|8-OCiqtR^eU(do%1k?>$Y|%+jxHj)e{?~?m6A#CG-1=E
zBq{A!3O<bw=975S&Nuj@aFd*K?zzcn%}d-VQ{;sxde%72GM1K&Dlpx0uY^z8j0tN3
znm|XJaW8>KiSQ!vTA2Vlr7?l8V=Zh|TSHh6+#wWE8w*ed_=tm61qp%J6Bj!Y_R1RY
zjgY`SRQvf!WNI*V8`;W7E`ft<L}(mI6J=+$wyn>ghmXW`fee1ocFQ#t?~Y<{_xJao
zi{&ORhqGgN*l(H;$ci!&ouUyQ$sUOctF6mmtGReyLz+U8B*ern_PP?dtLroS8(phy
ziC;V1p(C^NRuw^J@N%)JyY<DsL{-X=!E!qIf+BEJ(!f1jQ*MA;a#T9om?DGHA(}P$
zI?d5Tmo3(N`XJCG89XtGbX8C61~x*v3|^0-M{H}IE+*^%_ZqACtO><|4vJh*S4za{
z&5Y601azKd{V-z{22K?VDrh_<hFGeisO4P87~OZgs`W7h@oA5M7{6f3H0Sij_K?9j
zPWa^g_lHlPSI?V#Dc^=)Drs?BGiu6>kTyE_(KDQ!l8{_R)q<)#*qZ7%*`+0I1rHQH
zmMw<a74y}RNpYKxF6RfA2aVew;7V=zKefZ2KkM9|ch3CPYWO+)18)T$BboyM0EH^_
A%>V!Z

diff --git a/snapshots/tng/pagefind/fragment/en_6b55552.pf_fragment b/snapshots/tng/pagefind/fragment/en_6b55552.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..c7664c8ead1762b24f6fd91b4cb423fcdab9c112
GIT binary patch
literal 3678
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

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_7829dc4.pf_fragment b/snapshots/tng/pagefind/fragment/en_7829dc4.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..3c8d4c0ed71127a713bef1a61662ab364983caaa
GIT binary patch
literal 711
zcmV;&0yzC2iwFP!00002|J796ZrVT){gsiQS^)+VXsWytwMx~SN}IH)Dzxk_c&laC
z^3LK^QU1NNzQmX$6sb><c)<3YGiPomV{5rmMl1vuw~^0vbQTTQ5>c7;z#+>~ilH)?
z+hNp?xHTvZQq0>b1nQ6&zNX5-+AATUP+CJObq0T|2O?{t=nJMW*TfgY1y+IFZe<Rb
zN?0<dxC6T?pENUTPwIdf0jVtj?L)2*Sn`3qA!SZk11p=urE;EWn4=fU!psU8!@QR4
zGq{{rudb+aTR7M-{%H>HmGL)lVJHLXYGTf9VYFoe6jD(+y=fvINgl%+qHIHFxnxKs
zfRP1cx&19UhB`?<DP=Vr<tEb<S9g(q!Ws!%#mXGqZZ@F_8PimPgcmc+b#I=k74|;A
zq$H`ePKIXZ_g#yhMI9f`|5--;meE+X2#aFDv8^l#8zIU(k8+P0TSeXEbeMaNzSPv~
z!AC0X-5kDnhm=!-%X!lm${rR!BxYIWVCkJQ(mBv}tvIcEs&v&guNq7^XQqtXX~~MB
z!ZSk<!5C_Y3mNG4^A+PVCMPItE*9MSU<S$Qs2>rKKD+4b_O2goBr^IJp+YSmx&`6Y
zhN=x-gJwNkFc%DluF$%{)^VzG&@^|D#OLDb$Ms^$7S}BKKKT|Ga+x(03#Nk|&APpg
zNCPuGwL#F&+em7;seCI<0#eYw1=_%Zv;>bT)Rr@(-H6Uccl{2<xS?>hPx`D@-SRy!
zn-1g2xJ$_zMr6yuNy}3EQx`iufSt71($l)gR|k;O7FqgW7kS!6I@-<fVF#ZvBlWKK
zF2U;~2_{bvoQ{qpm_9*}B>Q7LxgTTL{6T$kgZq=)8Rp|R+2x-cn(3$|qdVRM9vW!U
t0;}WS!yX#xxWxv?*h3yW($P~5og6#U<i8ol2N-_c{RPkd-6+He003r!R0{wA

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_7c3613c.pf_fragment b/snapshots/tng/pagefind/fragment/en_7c3613c.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..66d42cd663da5fcf06e9f868e860df1069752862
GIT binary patch
literal 1349
zcmV-L1-kkliwFP!00002|CLtTZrnBy{gr{9Y+zS$oD@kmPeGcX4|zyy7kQ`)gDZ_z
zY`COAQeHcTf&NB+uV2zLq;5&QMG6C6X*hE@*E8zWjvH<3>$<A%i{6`JQ#=W=ULSP5
z;~1VqzKvY#_@r1Bm9vp;gvuqP?;tHn?>pxs-P0(d2Wq_A(^av6DTC2AUKOv2Z<BuI
zU}phF?{3w;GfdjH>~#$E3GTQ95MdkJ4V|Bzb+@mnWxZ?T^g3O4PYv8!2mOUN^z^x$
z4ThcaxS&jLv;82=udhks+rZfm&hwsh7y3Qb&Nxp2;A+otb#-OouMJ#9j=d*U>rMw<
zX=0;OP!IU~rMHNIE+o)S)g@i%y*A2Ibo4=67H3zq?Gd}Ov}Ni8*K!DN7`O2adu0gb
z9LP1vv64P|*RhY9LpjGuC%DM4-Np8FL$PH_QZd4_sEyCscDOJ@$$zn2JBUK`+U{U|
z39WRpWe7-0&2YX|Vcoc@4;wML7L%=W1_l=##p~#MrbEj%-IL2qRqrLa=1%MfXMj;6
zMzu9uC$JIdM{ZPaQ1Ah*q)!6ZC=+-^*2PvF8j_WgB#wDj_1alnv4Bd3VRmelLy}+w
z<3=m`%y(O-d`-&Mw0B58=|Hs($+1+Izy>82gJg~45VbL*^MsHNjCcHw$VsvDZs*m0
zucEG$5zp!z8r>+<qbpNLrzIV{>QINf4l=fAG-={b5Yk|fi`i%&Vpd21lUj*t!K-vq
zbEv%Da!zxLfr(=!<r>lr=@dhBPRhfQn?^*rVwXu%Mx#Wo*J871hJ&+z|M^#j%1x_n
zh)6w5kO7BYZHzl0B<JgY8H);PCgM)=7Lyu^)!SNm^s;!@xezq+x+2UPRFu6V<0>T4
zp$Q<v9U?)N#TrdiwaS0TT>>Pk3ghZadOP)G>YC7ZLO@dTyOfBZV`_;D*Te&;0S#tr
zw3-iPy5*qmzRqlz%Db7PM{!%{^%snuGHYe@&hCX}zAg4olhT_}=R0cuh}H2{sCCn@
zM4awUR5JN9@(Lu9*W5WHHmO^k)pK)T8uCqsoA^k|6Dmtb#5O^R9wuWqF_G*GrL7Fg
z*4?6jX^J0#nw>y}s$td>@X)Q_BKgeaM|~0=z*$l|=FR0d(SMbs0l1{jsES)>&=c#t
zD};9@`h2rgSQ2T#NZN@YePSEy24=}Y35lTKY(Q)8ds|88Cz=Oko}AKKWCMDzYlg!#
z!g4xIaN2;0(bQ*_f%jaozCj=L*i<~T9=3~(GDC(jME`vS79j?Fw#`?jrJi)Bi!;X@
zCH)JQf`rlM7Jg#8?Mh+l^+2``>!@iU2uLgTBmSMjP|m_UcUz7JmP{TT{d)O+{gMWw
zav*JtoH>~dQ&_2dIo|0qiCH8WdlEy>b$4>;I?c;N=_T=CXsF8QE+qvPef&QLsY*Gs
zL9#ZaGk1aP7XtYx^qT_D0{El+E>bXjdri$e<HjuLeE?~KRdtR?YP(g{XW71Ksh><u
z`);qJI6AHGbc0k6ylHpBja(^Nk#dM%kBtdl(KwNBKF@!oNKYQaO6r~GkUnoDz)-0!
zwNr_2NTJN@3Y!3*k<ZUwt%^n)jC&|H_YbQApIZt~Mby#o;ybgznX(ne6^g&z7Xvpz
zqkRfcUE}FGx(?40%hGaHj9aDHoIR|*vVAt%cGG9pjPP+On=yVkKL#R;U^XA#X2YlF
zFOFG0wmW8|Bd0U+`Pr*u$m3iu;(EUjEihiaJcdz?oit;-U5I9kXD?qo{QmF{<V5q8
HQw#tAjxLp~

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_826ff3d.pf_fragment b/snapshots/tng/pagefind/fragment/en_826ff3d.pf_fragment
deleted file mode 100644
index f7798919bc323e004ab1097afc24829d688f2aad..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2226
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
AE&u=k

diff --git a/snapshots/tng/pagefind/fragment/en_62b368a.pf_fragment b/snapshots/tng/pagefind/fragment/en_881485f.pf_fragment
similarity index 84%
rename from snapshots/tng/pagefind/fragment/en_62b368a.pf_fragment
rename to snapshots/tng/pagefind/fragment/en_881485f.pf_fragment
index d17fa918e7277a8b5d32ce04cfa8288e29156556..b684b920a5233f92d397b0e5a3e955fa1c3220b8 100644
GIT binary patch
delta 331
zcmV-R0kr;-5RwqE(FT7YJ^k5YaemJ!x!mL5(7(}qcVp&@s=B<Nl!pKGVYGsISxen>
zNe_dzdCeQ38XS0Wm`9yIJPkt3kte?(p%j1J<7k4vNvJiVzT^h8@%C&-Zd%KE1&v_+
zXDfLzp7hB^4=OFfE-}KHOpoGF<o8elDZ;qEIf~&Q4E9hOVuXKla~#L7^?NuCvBjC3
zI8)fx_kdbzgmiV$hjeI%YY}_CM#!&T^&#(WK`my7-l9#fF8k2xNv*|+C=tT9y*{%(
zYlF1i&*95y?@7ArNQ-muTZDRf)rU$$Q;QS+Y9+5OdaKIcC9Q1pcPo88o*tL>x79vI
zLyeH8lM_hpPU}M;)zk>-YQHWfHB#L(Ta=G2rA2r(z3#JRx0$y%9eRY;U#Fdhe*iH0
d6k+z~U*}%v$K32;-fVx|{th5wpKJOV007kss+Ir%

delta 331
zcmV-R0kr;-5RwqE(FT9uJ(u*vXPbAq`UAZQ+G25j&nfHNtKiT--h6js=8LMjyq}bY
z|MX$Bf_XVWH8}9%FpoNacp8M5BS?Nhh$;TM$I%3T6H;qLeaQ`G<L%jw+_aXf%?g6`
zpRMG@c+w{uJ*cz@yTk}*GChhzk>5iJqzL2s<|u}LFxW$Bh!KCz&2b#R*6-mo#1?0A
z;!I&%-ver?5z^H~AJU;6u0`zm8X>=W)rY*h1+|zRdW$x_y6i)%C$$zQqC^Pa_WI2F
ztPRq3KZh@;y(j6eBQ4IsZxQO{RUax1O)XCNtChUE=&dS$m$b6Y->vlZczRsg-&Xq=
z4K+fVPEH`XJFP>5R8u3QtNpr|)JS#DY*9Y8losLD^t#WM-Dck6bm$RUf1P$3{sF+~
dQ-s-{f1P`wA9J&Zd9(d-`#Y1SUHSSM0008duIK;&

diff --git a/snapshots/tng/pagefind/fragment/en_8838b7b.pf_fragment b/snapshots/tng/pagefind/fragment/en_8838b7b.pf_fragment
deleted file mode 100644
index 0352196202075a77d6ccf2f733da71f56da9bf94..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1287
zcmV+i1^D_OiwFP!00002|IJqIZsRr(e3gazr-!rT%lF0k(>B*1DXz`olH$<zih!1A
ziwGqOBo*5=0`xWddVP}4lCmY|njr0=KoJD6MDFbDaCWIi%;ikg#Z8eH>!h_hnIvQ1
zdSjK)<4RV>u5P^2a-58k+|*vy9$UT-3v`Wzj6Nt|k}oB>TdActHRYy|q-tuk$mIxY
z%8~Q3A#Kd9BjLmLnX=9kLMnignT3~gQH2OeF**5=<HG;>`yVd6zf-Oinx?JNg{tQ?
z)h55i3Q$4NDd!!7iJIEFkXEmF(@beC3$ilzqMmC>Q<2}!t-+R<O(B+41vxT$E4;LU
zFt`>42>{<o%Q!tiNGNh76OMPZ)(cf<^pk0+khvCC2H-x?AQ&OXhfrg#a+K1jrPPiV
z3aSb0^Fr$l;{}T=$Qc6_K>+efE^n$^W-9BsFCA-rr4>{x#T_tEx$+|_rR}tAmgL&m
zOf56I=EJDOt&D1hqmsfYRO}5XiXw6dYgGgFE#(likRJ4DQOcTDs8QrO_}0vIMU`68
zod6{l2^VTMLvj#eCVb*v<R!{M3LsY*ottJAU0}2}3ofm54YssuESe_8+rlg|7b=4u
zD8@?mR1ks*wl*Z`j5+B%lLpVkFs=cT;aBu5TNX(m4fA@xJ&`rb@5>3!rCFXqIyEo-
z=BYo!34L*Jdi?6m(HUK^SrF$;YjZiFuY!A0^w5_d6Sk8ZPg|EY_55S<;%o!o2xgpx
zr#?;hHa?!wJ^tjfF?NSP?DZii((~`0*Tdr0934(MLd0_(ME8)+L>q4!FFG<F1fMz1
zSUR}NljfE{8=}98=<8m((B<53QISnU2V`wT;dm|d*J3j%23oy<8FOpcn1B-40OnRA
zp@Nm8UjUQi83=Ix-<TtIT`i-*RP90sg|QRzvZ2vG(z;;X*2!2<96>QUc-$;%W{eJM
ztW5FG2UF0`sv%+Xa=@rn>|D&35naq;L!jZ2>#eHWB^k?QU0#g_m>?mS-eP93qFXJ7
z4Nz6s<tE*^x`@$1?xyK>j6yMw!MrmIX|GBNG4cYGGivyai*KMlr9WClrT2}SjK@*S
zLf(xrQ|I0EPuUph_DTrG&VGX+>1FF@p_?|ZcHqBVHXxCH-N}}|3rE{Wzmd+XI-F`)
z%9vu-&8N0*&~jVjI1CgXo_rs0ufxk+sFRq=n4b}quBEMjxUDr7c=_+j%fNwo4qkjN
zzi)&q|F7K6U%sRt(DvV5(fby+@_88jn>pK9Gq<9Op3V94pfn8^aJ+_tw{2So<gKx@
zaabHzs~a?|R+|=XWX(5bY~VO1T*+?V-ot!-1KF|BMY!q)BRB)YnCTO0byMNm78slV
zVUk?fx#4O*KMB667RDAgIiB!Yb#S~lO3+f6OfH$M??*``y}+-;E3f75cNb#A5WNwa
zzsRm~E5W8T+b^m3dF2ONvF)GuZFrgD7E8cK)Ol%`+%M~-oAV61#~BLzy78vLZ;v_m
z3ERyKPbRPKN5gQjiS}Ze?j7~<-Hh9b-QPQXD*CvO4zqJNcK^xDCw**~xDR6Yc4HlS
zidO~*7<f|eRPX>||G5yyk3k$AKNsTUF^H4Hr$l(&hhZk{MxO3J6?xi6#!2!Z_~41)
x{a1Z3&z}dOhtDng^<zb!9z7T0^bv@IXB%Kx%r3;?-u<ule*shl0Z4NV000$CgYp0X

diff --git a/snapshots/tng/pagefind/fragment/en_9a47fe7.pf_fragment b/snapshots/tng/pagefind/fragment/en_9a47fe7.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..c68f0571987da13f992e1a442caacec3127c83d2
GIT binary patch
literal 3259
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

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_9aa3b2e.pf_fragment b/snapshots/tng/pagefind/fragment/en_9aa3b2e.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..ad82990636c397ce7532b640ee57b639085b2090
GIT binary patch
literal 1942
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

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_a977354.pf_fragment b/snapshots/tng/pagefind/fragment/en_a977354.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..77221e738e923e8ae4a11c021d14b963df77e69f
GIT binary patch
literal 243
zcmV<P01W>hiwFP!00002|8<YSYQr!LhF>M<oF-}6Dd)j1JB)RQu`!HitBIIn1xINL
zA@4qWT}BJ*P2$)8@u}Ah9>`l|jh$f(4r(Zykt~*dz$4*QLJo$#pqH5K9eK$f>4=-B
zb6)&x*}BE+iGx*!$5gn>;XqC>3{cNY4jqb)69|dJe|Zr=U9?If;+s<GK?1Kf8>_=t
zao;?@R8=^sx9w}Smxp4)&wec`?UL!GRW_J_=!cdCqJ;LQ<z)0e13K)^ueIAmuyInt
ti6(fGTZ)d27Ge)|wd7Zn-AZw((f>7mX_s18oZa%Vd;?39cq@(p002lTbL9X4

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_bbab658.pf_fragment b/snapshots/tng/pagefind/fragment/en_bbab658.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..300b2bcf8b8e529a73185f0a5cb409ae034f3e98
GIT binary patch
literal 1498
zcmV<01tt0)iwFP!00002|HW6$a@#f#eiaN)?TkcAa-1gesp(AHLk=0o(;k|R4UrIq
z8YEZ%v@B~hlZWV~ua_t3w;(8z`t>A-o+JRfANJ?N?y}^Wn9Cx)OOtdRRYpbA=t3xw
zi^AE9%*a&nm9E@HG>8&iIBY}W7wo_H`!Tz?V7CitnRw!PsRXO6u*@w4yT8%Pdls-_
zoR``-mgv0H1$NlaS~FQJgptm&-(iDZvNc=E)GelLG8&an*K8qVws6~JdoLty$rD**
zQ+7p1H(vWjB#svu%viG-PaZO(t0J8;BhqWOIeI)(m7w#@8JLw&N-s|#Wk!gihVpP#
z0Uy~%B@0*b^i;GGt?n5wQg&}BZl%$sFir~ljiDP~?T79g!*nh@Z~*tdC``w%!r~e(
zD>xJoN7u)q+HtOgB0}0wnCXIXMm+9GCHheq%P4%1l14CFnK?8OM7LlG96{WFq94X_
zT4=|(l35{ubBlCs@$o3Eldf{0qEDpP1&mT`23Ti=OBN!9!B(b%M5F<h(g}CiCKihU
zs|qEo4X0K<iyGK)xM;t8{zu6NNQpR$2P~Jxu+A>ihUNTe=ra$gr8W<YXHc>ZSQ0*b
ztY1lwPvPan%&kf>Wl9tooKD4@R|<>)U%Zd0w8#x&G81lze0le_j>~$jLK*O^w$i8a
zk%K4<YhIR0!bzvuOyi1$Hu4!&ge%YVM=~hEVr$T?W{#UoIBbbT&Sk>*leBeKQaPUs
zL;Uv_Sb99(hPfu*^}U=npu_gkQw}%MjZLRyKkzi&jcHl$or`G@1F4AT-g+V@@uW&z
z1*&m`jV%{iiSt1PjTo`Y9*mqn`Kr(bD~C$V-6@Y6IYVT8iJ;TvOT<7Hr}I;i^fb3z
zjQh*xsqyZM*E7chWm}&MvFs)B$7021D5p5H6kkXqPOSvXD?F^3@TFKPF?2EyFO}os
zDb=aQYCPPI$v*i&7EesiyASEh=YK7!`8)*!>vHu`xKLD(^kBmZCE5yS_YhDhtGpna
zpM}xedV<cOWFnnfF{s5P_BHke^g|}@m<I!>w3<-raO>X{RaiXo0K%<B9VKY?U0u(h
zV;^LReAOb~#}p7e$l{=_V{dCw<uhT(Sdy)+2qrVT(3SF~weT*#7^=Si6dInH%sVk{
zyu+e)%;%CQgf4`N{1*|1ig#!%T2Yxcy!3sdS50a3Xc>LmBWg1)Bu1cXP=%NbXRG0)
zE*>7bt3F^lmo<AZF!-ycWH(I_Yxb_f>nhMk=SJu3Q)FFA9R#(*#+G{Or|9|{XO08o
zT0L1|{z(>6rKm;SK<YYfqqs3{UAKM=5l%b-@l$lGOLjx>WZi~<8vQM^<_>A}xm)^_
z;h|3A?NE36>T&1l=E`@z46*m9f_s-j6FCbvkK*{adf#YBQtKPXVU{_aXa9tF9-2gD
zn<0ZNZr)t%{R@=aRw&0G;AcX^3y7Wbq9T(1?=08`shQ}`r};jJ-b0qMDjwk&Jf!Bt
z2$j1!PUwFw-npTJd?=gL03bK$rZrU9wxW(+np>YK4|kw2pkoKfI`{aX!nl^+!72Kt
zx_UJkM02S?VH-`?n?aNd$MG-1bg4w|qYJ7s$A=qztGOb(xZ@Zfbmwbr7<e>}-<2O`
z4>!O5c9*4>&sDq>v$D~?<BGoJTCIkC5iZBvhq(!s{IQNgRe|hcOv)+#-Jz4?KZRr0
zG(Xu&T}0E-X3*1~G}_Iu)pphvYky$vVUAzD-9f$FL2aShjgJ1+_>6vMVBCZ1pLI~*
zygrB843_(tos$mY+wrmJHB-`|=<ScDJE%wP45%$syV2Eub4K6KjC&x>Zi_Uz9G^q-
zQ{_HXv)#oy=hd)B*ZyV)=ha!8>dAB;YP;V>dwnc})R2cwvu?q9Q*0mWIBQXFT7-Jh
z(feU?Ob^AV)vFgBz2kWfqgn6Hu+i#YPF|n5x3AxBbo4LZZvNc-2bCGNA)OKc0D`6L
A-2eap

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_bd3f722.pf_fragment b/snapshots/tng/pagefind/fragment/en_bd3f722.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..f20f0d204edeb7461a14d4c63770acec3b77f004
GIT binary patch
literal 848
zcmV-W1F!raiwFP!00002|J7C7iX1l({gtAhcA<CHAy4VW0Vm*O!B2@v2ys|6l6tzZ
zTI%RBv%@fu-^lOfOLC;v&h%uHV1r-G?n95Nbn4WpizczrJzMplq&hUoo2F}SH;I+L
z?VU{FwrLybY}7Ww@;V>U_rfZ}cC(^ywU2@=X`@GY1PVzGBm%wFkMZ74DUy&<Pm#F%
z=)D^$4w^=n0wMrJdjcE@6CAzQd(zti<UDWKiU^PS*437MOu}4eueB3ig%#afI4VH&
zF2fK<4SYvlOU+xILj_$STUcpKA<`gVD%q{*?ZAQXzvaMdlW%yJHbWsfh;UQf=*p#d
zO_O&M65g-q7nevP-Y6_6nLV<MycMxToT16t%&00u>pd<QQ_{)itLu(<oSctzpl?!)
za6itOzH35MH#=4v9m6W%PJGwgk$x=R(&3iPkgui*vJToa^!gb!bUR@E1cr=IZ^Ry?
zaUcwDZ068Wh{DIar*H>~s8WY`lh+~8sB;);SiaYaUVaUSQnghjd<TNZTFCC@qQqyQ
zdlDmw^7E<Utc}XJ$MW|hk8FfD`<C|q)KD5N{C^4<2ND1J<Ig}cd5;5JC~jJ{OK}Ux
z&1Wa^1?^8E^s7E%EDCIv<)mtR8lQR((~^z5IXO&%;viuLzhomD)WE^Pp9%pN=!6t_
zQG*q|#sum|F-{nw=gr<OODW{<iT%k+yFuGR0!V&Vr&OO~i}9Y#MZc1XSeJ!SGGdQ$
zE+8Tg?}B3Qk_D^#zVum{_?;Kir01JwO|iYix#DfM+EZ_0t?aT?^IEHP>#Q>vrf?Rw
zc-DRKv?=CY)FZ1Z^Rk;M3@#aUT2>rCwqMVU`bMk)t)5b<9s8YUb!yTJhTUBKJNlt?
zbe3b;T?M9Kc5_SpTQkm$_JK2VLFL1z!(<MZ3#c4rDi=8)YTws_qm%xxEP1t5Znfgs
zIZRqI=185&v}0qIk4f!-bMHkS^>TiyZ&*0r<acMSAy7SL%aMht<{D~+cXo%j>_MV&
z@zj3#;;Xjl*<gx8(;bd&GwLYt)kMsle)bkO@DNrGF1!DFXeuoHhA#lk3SSS=P592D
aKfm8L#>vvvP50vX+wpI|kfc=^2mk;j;H#AY

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_b45f278.pf_fragment b/snapshots/tng/pagefind/fragment/en_befba3d.pf_fragment
similarity index 83%
rename from snapshots/tng/pagefind/fragment/en_b45f278.pf_fragment
rename to snapshots/tng/pagefind/fragment/en_befba3d.pf_fragment
index 1a486cd08dc6ed8a82639e4093701ec324a20179..5d7c2b0d4b85240a6f29ed6d180ace5aad8138df 100644
GIT binary patch
delta 127
zcmV-_0D%AI2IU5@?gDq^FCqKgYQu07Ru>olJN4_Ef3H5ao9l!6^x^IDV48kLZrI6R
z#&q9Ihzf#ef;Ncye~;C4b>UolB|wd*O%6gLx9)R0E-04kwOapjs$U>)W~9{O2|2wz
h;jVtW`4O@Ne}>MlPuT0LH>dwk-vCJQ2&gg#001MtLK6T0

delta 128
zcmV-`0Du4G2IdB^?gDr>?BwE~ZjGtl^QQb?WWQT&7*@mT;$PvN`t{AfS0CHW^+A35
z@OF7HO<zF}P0$8W|L?Jyt}YO@SHi0Cw8^2zv)sDR?YN*=uGeb)%c*{WyqS?wiznpt
i_Jq6o?dC_w68srDzdm8Fuil*gKYar}JFxRI2LJ$Bd`f%(

diff --git a/snapshots/tng/pagefind/fragment/en_cbe0403.pf_fragment b/snapshots/tng/pagefind/fragment/en_cbe0403.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..6f16360fb97f326a65b0e6c99566b53a969e3211
GIT binary patch
literal 509
zcmV<Z0RsLXiwFP!00002|8-N*j?*v@{FRj-QJb_NR7jt$P$2~O0w;mQp~!KziFJ-0
z*^ZJDMdEAtFusI!a&6j5JVdhBGqbbyq~--4q|Vb^<UMPwVhM|jM&=l2+)3eLwqU|&
zkJ{7GZmdP{P$ImDoRZqZK`M;k>$n!Cs*NVB18x!Wpp7|54Sd8wD}4!`*b^5!5_ZyP
zaE&N|JE)G!v&ht7>Nc{a3tR$w+X&xSk|xT*C}mogKo1{@X+0VIpiIUUE#95P;O_75
zKNs6w*bcK}xIgY1@5zePC0a=%JdiyS6-F7GK&H5O+Cm&d6h*|uF7&z*xU1`#{f(~G
zw8XD19?+86Wh--ECh&5#s=Mt)y+m1*K7sXg@CAkEx}br3xTf3yGjdc|)95^b!XoM|
z`8v<hLzk?!NBY3iBndpS66vZQ*$r%jbP2p3MNin)Sd~xM0rm>3@T?KVfe!LiP*+OC
z=FNi9(|ELwCH=5q6?#r9=A~D7P7JYRMNtds^16sqPETl_BeukjS2cy`{rCG%pEpmt
zbX~snzhu;6R-c$DS0RA=2?}%c7&YZulqNX%(KDQ!61H3ia!#w%n;;Y>yR@W?;GV+A
zlGU)dV!k>tDQ?TL*K+K2*0}uvuGH55Q+uwtS!X|2X8vX~{2cxPu));?ngaj;$ejK+

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_ce2dcd3.pf_fragment b/snapshots/tng/pagefind/fragment/en_ce2dcd3.pf_fragment
deleted file mode 100644
index 3d27b4cf6d48e1d55e4b83fb40a8cab095249835..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 814
zcmV+}1JV2+iwFP!00002|CLqSYTPgo{guH_4S1d1Kwlh632g#>PM{B^1X&*2Vr9vd
z<h^uR=x_A*`XwFtwo)1jdDD!}Ihq-bMjflM5~_SId3j2DBa=M2u6t49HB+KxPH1(V
zqzTu`p>ni)H@j^H;rcUj$qd3mvruURozWc{C(y!PxCUG^LlCxj+-p;U6kDVXVROJk
zr;P)y+fFMw5bh7G?IeOw4I1Gre5Gjh9!{i;6&i!(YA;IH<gi(<yTfhZZ&1{YTQ&;D
zx3$r|Ds!MnSw=`}v4oFM$Q~gFBHb?0UEp+B*_$D$9B$sPTYC%VK?3p*@T7a*+<D`4
zCifHNL8(f)2>Fz`mX~52hsq2>uy0V|4h;y(x?!qDs^x=FxN^OUs@Yqi>Orj1QtG|8
zI%Zgl4h@yAM9Gf%Sm2hzcAzV8qNM;d>>247NarG0$LK;Pt>u6$$ng~oqC2+5@lqqA
zm-qK2DUOVAII66;=jT)p1l6|%r8sF>;s$iv=w6m!dJ5qV6xQV4A?%pH6WbvdmG2&*
zs830qE{UMNNQQCOGdUuyzYplNwW5#|$Ad37nwI%4l1DGEe9o7GreHBhW90<jzPri*
znJ;t>oT4l|;5Y;x);)tqqK-hDDRe_s80>`g0Syg^iepZ#t&o{P6jws6e)O!IEZw`%
zq|Ml~_%HYf8i^Vgs~Y!@tce&x#f*!+Fd~<Km;oU$Cw%Oo%3uHw%n2TQ{96m)fjPlr
z4;O|9@W7nlv4<XprP~d|k34e*FP#N-Fb~s+9CKuokN1V(s{(%tH1AjnMG8EH@(P&m
zUHJ6)n8E$fF*M|cnP!I;W72BhXVoxi{BxpC8-bRdTroFa&7?$goXHt{aesdOwj+P;
zd;b>av19#Mp>BL_0$Z9Im)573p!0=yNZ}YwJQ|;V;?3{kMK$~=q=|P?wSm+db!Ofh
z&!_*%|0B=C#7Xj-%_dDMA^liP^3yp@XhbqvB~Cbr(I1x3E>pbG9{TN+pu~3k=b8=4
sijr2(PIt6+c!>W$@=48yb&{{o>FaD3;{UI)Ie$O@1y<yt%#jBG01Ow6K>z>%

diff --git a/snapshots/tng/pagefind/fragment/en_d045d09.pf_fragment b/snapshots/tng/pagefind/fragment/en_d045d09.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..938adead9ffdf1205e71c6ad6ff5ca271a89fa54
GIT binary patch
literal 802
zcmV+-1Ks=|iwFP!00002|CLqEYTPgoewD$e1ia2B(2GMUp-rIY1bQfCk>#;1R+d~z
z-k&ZDeT}|epQI!It(4}Ho95FupJqm*QO9bmgeo^BFHcEtWRfR0buUW1VM?^j39W9D
zG~rq~RE~BZX4q!%1-WDfVWC>6w1Lj(4viCNVJ}<*u9+zaTRiTyDM5-Y(uS}(;GxsT
z0oQG(6&(VP2iA5HL8u0ea2CE%gnADrQpO66!E&`1rE7AyU9Y>teSkM8>c%Y_1>@V=
z=w6jMP^2s)rnOkYCn#i(kOMj0FVS7-bXeJ&A*mehKCD}N59dJw@{jPMd)_>F<8&tY
zh4P?OrCfx3%3RA!F^)rJ1|irtsBnh{1ZCYYRU_5%Nhn;oUPaaHtx)wKR%t2q-di0r
ztVM^0N>`#}$9ybsOJO_E6*$pS02=m;^b4eO5v*f$A(Pf}Ko;cqh6cGiw#D&MBS$aq
z?@Lk~8S!vbS#j^5Q#}w=-xieOq-DuBaJP-_WeKLI5FS8bP4Et3$NZhx4!Nj&_XtJ3
zN$PY-MD;~7jJux6k!k&XK&P!0g`_y1e7VuI%y*GIdU@q@z7#YCi$NMIC;0a2Is;_B
z&^d65vhalC5O`Sk44%n#B-%`&8>+%!C#(->Xh2jPb82mc%nYKq5^D9cXXRw+-i0P@
z#>j$S_z^V{H7-^)?mt-*c?cDIT<paog8ah_90GIV#|Tvh1A1Ui^ceAPEuaVHM2`_J
z3=immIniT;9)_jc4a1L+IfK_=K^@G)G$LS*Y{Gb72)-)tmq2sHQYcd3DU{d1eDA{N
z=jRL_hmN5kH_S9Uv>20C`#!6NN#marb=pX@^yG@U`D!L5n&a%8!B_Y9_a8g@&wcOT
z;yiY&A1l<2Z%trJQ{&S5^b&Nw_#IL>MiY<5r=NK9yLeR%KMHB$T~uu#^-i7H@15t<
zpXC3M%`kD2{O)$0CY6wWEGGHsoF+6P8Lbj0oW$tgN@$lU-e^z#eo9bcJN|9WEy;?K
gRvV`~T01<%e;#2{^I@Ij>+_HEKd7W^wm}B~06D&ZAOHXW

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_d2367dd.pf_fragment b/snapshots/tng/pagefind/fragment/en_d2367dd.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..0c01776b56e534f6e47d6d13e5c2d37e0efece55
GIT binary patch
literal 897
zcmV-{1AhD;iwFP!00002|7}&<isUvB{guK`8{+9n0wK@~fj|-n<Y6Fz5JDJasoWML
zOGc9WvO~lC#=`E;&6n&c`O@9PzI5A?>eQ)Ir{qEHxV7Fq8f~7dF}iA7-S0+g_<k6p
z&8PdSu5|F3ea6;9S=-QG&iefN@-fj6!@x10i1*5kD%;@6CUWY-iIg|=`tm8V(%J6$
z_2u)19+vYBvRc1Oq#`fDZ0OLjCq&2|<&G~2<Opx*S030K_S$lyhVy|DFdvd7fm34+
zJ-BG)+=+}$I_x<D-GD!Eze0LLe_tm{IYfX70sN0HQ)tWEb;LiyRb7H~r~HmnO-M^-
z=9#a_?KqPU*|wHVO(_6U<$~+^hzHxVyxBNaD@uwM^}IN1HZ9++qHXB+5TW*o7O5$n
zQs$m=phJjHbYSP|l{*lwSf?(G&Ukb)&lMD?&?Js~)i{7<WT9rvw+*p5v1>Q<hbRL|
zcG63$#D%b*1Un8;FwMSz9pEdmLQMhN@n93moV=8jHA1;lQUN@8$8F0xCm8PPt+W^{
zK&><xF3@Vcz(8Ph;Gj;4v||+~Pa)Zf4i=s1)PUA(=}+<Km2G>qv~ZR?M8on+sw5U1
zp*%rND5NBpg9vyu#tKlq7(r^eYW{4#+g4uXH)uE_)OG2F)a*d(X@pG%EW^qTLna&I
z)cn!_bU#V@b+iysCYAazWkir@KRJC`*P$P*LrLu05H(2ZU|8bhB$dHG=28fv+sG_)
zApB@;&BM(}>$MxPz1Fw3A9K+JBSHY8z_+8<dD@Yy;?1rMZ=>`Rl=cQ3QxQ3hx`RY>
zzWTQ3E*!WxXz}rC)>_&qh*<N%-`!@w-oj-=zj%O&;g{`H*bQUj;I)-Ayp+3XAO!1)
zPnfilyjM@fK|Lw0rFNO2HirH(I+x22$Yl<0Yo0dNT=V5rF5jY0w0mKAA%pJUUV7HI
z9HZO~|Aw)+$gp<P<h%_=k5HP;2)oSZI*4Va-}q!U@i2c501)Ejrr_nu`|YUu0aZW0
zX=NM2yKm_3XVA;<7fEltK#hv;j$1jf9NYjVavr0nBYitzyr(mr@o5sxA9Wbz>-58q
zKh;%hU4~bx?en>=dd><@RYq;Re!eQ~D6hL9$Nqb+828BZdF#Fhq&0YY%wfQ@c<d5a
XS1#x>tJU_q^Z(~BY?X<UJqG{)9;nZ@

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_43f9e35.pf_fragment b/snapshots/tng/pagefind/fragment/en_d87abe4.pf_fragment
similarity index 78%
rename from snapshots/tng/pagefind/fragment/en_43f9e35.pf_fragment
rename to snapshots/tng/pagefind/fragment/en_d87abe4.pf_fragment
index eb1414f3ebbd5c73b1db3ff5f491c253bd446d1e..f1cc775908cf5eb20d26c9f82698cae205a35767 100644
GIT binary patch
delta 235
zcmV<H02Ked3cU)jTLgch>x@m4$(k9fRdb;k@#3B`9^F3JhxO0F`d456w7CCayyu&&
zvR*Su_nqbxR$2|vHA};-A|Agz4a$l_)vZsq5k9RkarkWcqdg%eRmf<M8LYhHuwy)}
zjGJC;AUbOehCiR4MQP3R7EX7yLBiw63rKE$^pL967Si?n91>%7X@gL{HI`HV>clcQ
z;ZT&usHyD+?OgYEJj{aY7osdY^unx{TUgWJ1+0^P>w)&=E%d8P(Ay33Ec}T=8-MWv
le!r1>9-dWc`B(&(`S{l`p4Vx6SsZ^q{sRIJKUT~T004%sc(DKg

delta 235
zcmV<H02Ked3cU)jTLgbuGf6j=<{ZU~`$;9I>yAy6$(k9fRdeAPm3rgR?Sp+-{~WA;
z_2o~C`ya-8zR3pYnx)}Z5s%-V24zJd*w!cH2%pxNIDEGJ(Vh^KDrB_B3|8K8*fE|~
z#!W9a5S_IK!=F#jqO|6D3#Yr<AmMT31td2=dPvo33+Z}(4vAyBv_UA}8q2AFbz&Ku
za41S+)YNu^cCLFn9%jMy3sDvxdSTYfEv#wq0@g{t^+5ab7W&mC=<SAi7XCz`jlXyS
lzu(9`56`N!d@O>?eEe$|&+D|kERMe){{cKUg2>De00134cO3u#

diff --git a/snapshots/tng/pagefind/fragment/en_dc70e86.pf_fragment b/snapshots/tng/pagefind/fragment/en_dc70e86.pf_fragment
deleted file mode 100644
index f9dc0b596d711decafa740c9730dcfe2e41cd64c..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1546
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

diff --git a/snapshots/tng/pagefind/fragment/en_e17bec1.pf_fragment b/snapshots/tng/pagefind/fragment/en_e17bec1.pf_fragment
deleted file mode 100644
index 9ad1f368e0f865d360ded72e72fbd0f4de503fb5..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1035
zcmV+m1oZnKiwFP!00002|CLouZ{s!){VM~V9KcpSwrLCJwAd!-VGlu*B8R33XlZ1z
zp-6$G>|_o9_r9TINeeUu76vS7IPcB(uvJ^Gv@KuCqC8}sH`zKn53yYBb-Cpj&Lh7?
zE_FQ5mRaF!WE-LK2<a`PIq9Z#KGK0sB05s#T|>{=j3y68+xVQ_5Wgk;!U1PNMz?RO
zX$_OMHG3TcJ;5Ef2P3etUendZMf-L`HS291$IsE+fhxGQ3i=zb>GCHz8-T6yFp#IO
z2|q~t&l{5X)^PT#^W2bbL)TF0jPn#gt{RTZ=VuFlZQvqu>^!Mbw>s!T6C0g^I^y?7
zXAuKENT97Mb9&H?Hp)|U^i^9HXP30;5WBLpVd?^xatLo2)_BKW83LRGxhgr9)4g{s
z`=~kOQ=GJbA;WeX>$5e*nkh*Igm+Opy=&XTU{59gf?PR>LiE~hfqsNmI@vG;B&B9J
zU#qaHT+xNKKwbp0an1nnz)`%8zGK?gY?Gb7%v5w<l55@tKR5%995Jem;WCk(h<@Wr
zbp{0=*m8Ojx=NYAOR_H3;?R(+lq7M?vnp54!o-X!0mJ0jvJXju5ssZ!^vdrWr+i7u
zmee>TpLC#7hvZnQOJIW%3m~C!9HKVn<UApyJ>whC6LV5*z1w=#G%D&s8S$*_L!+HC
z9lA1wbe7ZJt2VjK7F{MC`~=BRguQxC8B3I+8AhHp?VZOgi84y#y#9t7E3;BYZ*3z}
z^d0N(qsHfx!eC^=(u5s)rSFo~sDf)}O7^RMHiUX?m(O#BdE<oI?d{kQK4sUsA(MTR
zNYbd%Y*5C#&LY(qs=RNJ#Tk7;?w|);H5^Jg(`kZ_6Q3%mUST4l9SYVv^jU|=<f+P-
zCX2O0g<<7a|8D|=?{+h6Z!#^hq&phcm6-gn$sd@J)!-<XUR(|B<S=km1wlX}u>tUR
z230u=Q^7YJ_bj>FJNonSZuKh-pnPac)Y>d2U<xD^tdDRsCQ*u{=N`q-bM3nvx)#f1
zb|_0oJdn|WurRt!X#k>&KLSW~>2nz*PeTIxy2}I+Hm^d5sSp{&_wt;jV7OgQ?KtC&
zy`b{}Yq@n;%qb$N=0+8-vR~5LT8wRa+vq5cjteSTka`uhvRfH=E|e?*ImFXrCzKk^
zS(4mpp8rXaF8+%vskfd(THq33C{&voD90@+v-(oFPA<x;U#^!~r45!>$kvDBGQ)+U
z@Rmg#4bN`U3}?y~7*Htwb;ywFroU_JOOWakZ!gicc$Zk_$Yo|+p(H2S`r^3!4*ThZ
zZO4mbVz{5nCXVZ?k4R2aGvm0Mi6)B6pRYgSC{9(IIKIq86UWu{r{mwpe*xK`o$R3q
F001E!`n&)D

diff --git a/snapshots/tng/pagefind/fragment/en_f1f9a50.pf_fragment b/snapshots/tng/pagefind/fragment/en_f1f9a50.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..72d3dbe71eca6bd76c5501bad38060025d21e71d
GIT binary patch
literal 560
zcmV-00?+*)iwFP!00002|BX}4irX*{ew9II*GZtgcrWcPw3qE=SqP<Df-H?Kv5I8$
z)5MrSU!$+rC+Wy`vPmGY_+Ux%_s#dsbiBnzTe*=!4lH@YDz<2ombehkMy@UT1uIy-
zpp9gGI6lLJ+jh><Ybar@(1P&DqqZ%GlcfM1|NZ$JAh<0?y~O}2V3Q0)2ii6!p%n-_
zg&sjDZ6u(<Z4L!aPo3ccWwzTKC`<V2Jm8*hJA(!Aw^9%lk03qYQ6v~%qXAyK-w50u
zb5g}XtyPqub3UF0fA7C^9hnJ-rqXMo#O+{!d$(Wfs2<0313cqC(r>YVvMk|1-|6_n
zB@k3fXJliskc1*A7b#N6{A7H+OR<Fe9watAnRwm3(XU87;Z*b3K#hbML28d;4)H{d
zYev`eQU%m0LPKmtrNfc3?AC)t;*<oKvt6f|z-6)`a-#g%fpk-v+@Vn1wiC8X?4wu{
z%zo}PJAFRoC)z!Rpq-tS812X2lt$0JP<_U6rfhYl(*>C)xxRTVA1BZQJdMK5N=5or
z@WQ5f$T!HN_QLK)^(NmFz)8|~4+k~Vp!X<0DAcW@LaXJn+uvPJ%@b)wlo9&_)Lgu_
z-X$w5sA>8$j$8H~jd8mP>4BDT=e*nqve6!{K7J}#qfJB~ST!69M*GF-#G;M{Z!9V!
yKW>F`Iq2uWX6ngXt*C&OblODM(K&N<D@(zQ6SV5ivTAwwb@&fm?UFM_1ONa!Y7^%G

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/fragment/en_f78c780.pf_fragment b/snapshots/tng/pagefind/fragment/en_f78c780.pf_fragment
new file mode 100644
index 0000000000000000000000000000000000000000..3b2742ffd9d9d93b57ed6633d8e60944e17128b3
GIT binary patch
literal 2221
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

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/index/en_1535f45.pf_index b/snapshots/tng/pagefind/index/en_1535f45.pf_index
new file mode 100644
index 0000000000000000000000000000000000000000..85040dbae0764fd66fc1cf3bc998b43146c09790
GIT binary patch
literal 9620
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
Kuoq4lJpcfeps8&D

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/index/en_179f1fd.pf_index b/snapshots/tng/pagefind/index/en_179f1fd.pf_index
new file mode 100644
index 0000000000000000000000000000000000000000..3ad637c6e64aa0b3d97ea2b52c026a1edbfcf893
GIT binary patch
literal 34706
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

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/index/en_30161fd.pf_index b/snapshots/tng/pagefind/index/en_30161fd.pf_index
new file mode 100644
index 0000000000000000000000000000000000000000..4355cd6b4b096d7654ec25f8cce299d0e29d769b
GIT binary patch
literal 35900
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%0AV^OR`n3&)
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

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/index/en_8826db1.pf_index b/snapshots/tng/pagefind/index/en_8826db1.pf_index
deleted file mode 100644
index fab75a66c658757a53d18ba89d7ebd1f31f5caac..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 34913
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

diff --git a/snapshots/tng/pagefind/index/en_e0362a6.pf_index b/snapshots/tng/pagefind/index/en_e0362a6.pf_index
deleted file mode 100644
index a1f992e32e2f1ad15ed517ff745d64b80567b7d3..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 31912
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%0A{$iPxKj0S7%YA{6yG
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

diff --git a/snapshots/tng/pagefind/pagefind-entry.json b/snapshots/tng/pagefind/pagefind-entry.json
index 032801f96..5cdd4564b 100644
--- a/snapshots/tng/pagefind/pagefind-entry.json
+++ b/snapshots/tng/pagefind/pagefind-entry.json
@@ -1 +1 @@
-{"version":"1.1.1","languages":{"en":{"hash":"en_fba963f199","wasm":"en","page_count":63}}}
\ No newline at end of file
+{"version":"1.1.1","languages":{"en":{"hash":"en_95c3957d2c","wasm":"en","page_count":71}}}
\ No newline at end of file
diff --git a/snapshots/tng/pagefind/pagefind.en_95c3957d2c.pf_meta b/snapshots/tng/pagefind/pagefind.en_95c3957d2c.pf_meta
new file mode 100644
index 0000000000000000000000000000000000000000..d31eaf9e2b5ad1d07024883f75dc2179148f8b87
GIT binary patch
literal 650
zcmV;50(Jc#iwFP!00002|2<PZYZXBhWnU6fS_v}<S_BIbWIpbl545tev$9e#-1!Pm
zFbNn?uzBPmc7k0j(usn9!oq*x53sPZvlKh$&D~_T*|U51oO92;b4&-dEf33n$>nX;
zclv$y;PiPt+|Q{hP*yw~$i|dGN4fiCz=(!)Fmk#wpz+cAP~>!Dzyz(uX150@3b3ds
zelRlD`O+&Vt}M2B(|K^frduRb;sc9#1aI0F|L9YM3_Al*uFgPX;1c%B$ld$Q;Y0R8
z$*prPjow=X_M)TFmV)@i`~<#LFSqXwSWN^Iqnr-7)}V3G$ejhp0a;l}a(cyfvL-Yj
zr|;~+=9Z%pryNI#-Z?F&B@-j6T%%YI<PAcyJ%RTu)2gE$57U|+YV4wmo7@XoA59QX
zxs{ZQOI`E!Y#|ufz&%zeQT43F-+|C$@V1K2teLITHp}TF53}h|8j8p4y^p?F5Q0M~
z!9}0Misw_&6V=&zY5=j|RW?q5)_U=V75d<k3gVdCNG9h@Go>>gO{^D`ed2uuL}s~Y
z0Fn}~2kNdYbj~y8RIQ*v@r@DX)&huYtdObO%rmF1DUiPCwl6B!ki<RCC72c=iD&$u
z0c=F#5$jc?%?3=j*jmzkt#KwbW&^8S@T%6<3WX#W|2RVk4#>)FE>;y{E+7{#xaC|h
zp}iz7RV78@&%AeJlj+1?c#gqSs(p?>=g3<kTf}cBYOZCZivyApC5J&SuJc#ju!kup
z$qUjmsj92K<L-infK6`g%_h7L#tJ?c{V|pd;_E<t@yY8XV7(?)mWMBwBUT^#i7e~Q
ki<5M6H2PNBZQkXRqmqBE&PN?uY=EoPf7LWzB2EMV0NnRJ#sB~S

literal 0
HcmV?d00001

diff --git a/snapshots/tng/pagefind/pagefind.en_fba963f199.pf_meta b/snapshots/tng/pagefind/pagefind.en_fba963f199.pf_meta
deleted file mode 100644
index 01f3979ad0de415011e8236e96cdbf104e58b9e2..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 568
zcmV-80>}LyiwFP!00002|2<N>YE?lL<(wo~T8J=%U=u7vkeNMuULg1fR#qy8dF&k$
zNJyt(bGa9>vrZFB{R|7iAF#Kuva=LB$Foo5REwFjUb8OBG4aWHKkBW&CHruEmyfrn
zbbjPRq8fvGvLKghL!0%D=L^gpicO%Wn+vSSoZ0O!pb-o*r@qO}=rIECEuhDmvEji2
zN}~YC0ulsf*Y)0q1tP`X3J4)VM#x!D#|yOJA!N`8v&dmHu2em}5{YJu2h`J-1qRo+
zWuvyDl3c2B+&vLu?@gnub_<H&u?`E<dy!!Z#bhP4K;6*@Jl|U&7Z)=m^+J-=)<Yed
z4^|5a@E<%Bm7YyEsD4YW(WmH0eUvjBD>bX9ThcPy)Y+?N;(gTE9V#V7_7rlgY9o!4
zkEPIRy)t6%{<at|=$(t|jilmSs!8fXVpM3Ym6b9;^pNSA(s2y2t0r<85UWwIrMS)x
z2j``58txvv`Yfn4=7j2wD6}$cww2RTO~qcP9Sg$o0P2xsPrw<gdMW<_dM-sh6+QBW
zDeCFISgUsI&99`rMMEj*c@iGxUQ*TbAL$TNz~c12TsDNcb=32jL~h+z@BR~aGSw9I
zOI8;!I_LEKNuc9Q&g<#>I&#ktllmz{9Ju+SCoiflP|mF9yK-vTk23Y7Wgw#yGDG#<
z+Iw{&6}@-3nusxhQ&*xI$JjBeuiITQ_3T7;3!zuLt7oU}$L4BDZCrp7Hk-e$0!IkK
G0{{R%TN85t

diff --git a/snapshots/tng/sitemap-0.xml b/snapshots/tng/sitemap-0.xml
index 29c85c195..01f1356c3 100644
--- a/snapshots/tng/sitemap-0.xml
+++ b/snapshots/tng/sitemap-0.xml
@@ -1 +1 @@
-<?xml version="1.0" encoding="UTF-8"?><urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:news="http://www.google.com/schemas/sitemap-news/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:image="http://www.google.com/schemas/sitemap-image/1.1" xmlns:video="http://www.google.com/schemas/sitemap-video/1.1"><url><loc>https://snapshots.slint.dev/tng/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/dialog/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/flickable/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/focusscope/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/gridlayout/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/horizontallayout/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/image/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/path/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/popupwindow/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/rectangle/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/swipegestrurehandler/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/text/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/textinput/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/timer/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/toucharea/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/verticallayout/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/window/</loc></url><url><loc>https://snapshots.slint.dev/tng/getting-started/intro/</loc></url><url><loc>https://snapshots.slint.dev/tng/getting-started/which_language/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/animation/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/basics/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/components/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/functions/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/intro/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/layouts/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/preview/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/reactive/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/states/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/types/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/aboutslint/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/button/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/checkbox/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/combobox/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/datepicker/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/gridbox/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/groupbox/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/horizontalbox/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/lineedit/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/listview/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/overview/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/progressindicator/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/scrollview/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/slider/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/spinbox/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/spinner/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/standardbutton/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/standardlistview/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/standardtableview/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/switch/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/tabwidget/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/textedit/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/timepicker/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/verticalbox/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/conclusion/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/creating_the_tiles/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/from_one_to_multiple_tiles/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/game_logic/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/getting_started/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/ideas_for_the_reader/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/memory_tile/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/polishing_the_tile/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/quickstart/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/running_in_a_browser/</loc></url></urlset>
\ No newline at end of file
+<?xml version="1.0" encoding="UTF-8"?><urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:news="http://www.google.com/schemas/sitemap-news/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:image="http://www.google.com/schemas/sitemap-image/1.1" xmlns:video="http://www.google.com/schemas/sitemap-video/1.1"><url><loc>https://snapshots.slint.dev/tng/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/dialog/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/flickable/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/focusscope/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/gridlayout/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/horizontallayout/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/image/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/path/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/popupwindow/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/rectangle/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/swipegestrurehandler/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/text/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/textinput/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/timer/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/toucharea/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/verticallayout/</loc></url><url><loc>https://snapshots.slint.dev/tng/elements/window/</loc></url><url><loc>https://snapshots.slint.dev/tng/getting-started/intro/</loc></url><url><loc>https://snapshots.slint.dev/tng/getting-started/which_language/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/animation/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/basics/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/components/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/container/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/file/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/focus/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/fonts/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/functions/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/intro/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/layouting/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/layouts/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/preview/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/purity/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/reactive/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/states/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/translations/</loc></url><url><loc>https://snapshots.slint.dev/tng/guide/types/</loc></url><url><loc>https://snapshots.slint.dev/tng/overview/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/aboutslint/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/button/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/checkbox/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/combobox/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/datepicker/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/gridbox/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/groupbox/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/horizontalbox/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/lineedit/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/listview/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/overview/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/progressindicator/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/scrollview/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/slider/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/spinbox/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/spinner/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/standardbutton/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/standardlistview/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/standardtableview/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/switch/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/tabwidget/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/textedit/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/timepicker/</loc></url><url><loc>https://snapshots.slint.dev/tng/std-widgets/verticalbox/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/conclusion/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/creating_the_tiles/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/from_one_to_multiple_tiles/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/game_logic/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/getting_started/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/ideas_for_the_reader/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/memory_tile/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/polishing_the_tile/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/quickstart/</loc></url><url><loc>https://snapshots.slint.dev/tng/tutorial/running_in_a_browser/</loc></url></urlset>
\ No newline at end of file
diff --git a/snapshots/tng/std-widgets/aboutslint/index.html b/snapshots/tng/std-widgets/aboutslint/index.html
index c4f0b3b67..a28cd05b4 100644
--- a/snapshots/tng/std-widgets/aboutslint/index.html
+++ b/snapshots/tng/std-widgets/aboutslint/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/button/index.html b/snapshots/tng/std-widgets/button/index.html
index 344e91734..4ca48145a 100644
--- a/snapshots/tng/std-widgets/button/index.html
+++ b/snapshots/tng/std-widgets/button/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/checkbox/index.html b/snapshots/tng/std-widgets/checkbox/index.html
index 19e8fbda2..a5db0cb5a 100644
--- a/snapshots/tng/std-widgets/checkbox/index.html
+++ b/snapshots/tng/std-widgets/checkbox/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/combobox/index.html b/snapshots/tng/std-widgets/combobox/index.html
index 4320eac9f..19a066cd8 100644
--- a/snapshots/tng/std-widgets/combobox/index.html
+++ b/snapshots/tng/std-widgets/combobox/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/datepicker/index.html b/snapshots/tng/std-widgets/datepicker/index.html
index 3b8a8c13b..fdcc5ac3d 100644
--- a/snapshots/tng/std-widgets/datepicker/index.html
+++ b/snapshots/tng/std-widgets/datepicker/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/gridbox/index.html b/snapshots/tng/std-widgets/gridbox/index.html
index b1b810f14..c9bef531a 100644
--- a/snapshots/tng/std-widgets/gridbox/index.html
+++ b/snapshots/tng/std-widgets/gridbox/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/groupbox/index.html b/snapshots/tng/std-widgets/groupbox/index.html
index 871e53c5c..72026b66b 100644
--- a/snapshots/tng/std-widgets/groupbox/index.html
+++ b/snapshots/tng/std-widgets/groupbox/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/horizontalbox/index.html b/snapshots/tng/std-widgets/horizontalbox/index.html
index eae2768b1..1d098b7a8 100644
--- a/snapshots/tng/std-widgets/horizontalbox/index.html
+++ b/snapshots/tng/std-widgets/horizontalbox/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/lineedit/index.html b/snapshots/tng/std-widgets/lineedit/index.html
index 5aef2527a..5d3b9a418 100644
--- a/snapshots/tng/std-widgets/lineedit/index.html
+++ b/snapshots/tng/std-widgets/lineedit/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/listview/index.html b/snapshots/tng/std-widgets/listview/index.html
index f22dbb8c0..28b7af3a5 100644
--- a/snapshots/tng/std-widgets/listview/index.html
+++ b/snapshots/tng/std-widgets/listview/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/overview/index.html b/snapshots/tng/std-widgets/overview/index.html
index c6fcb73ce..cbc8ebabd 100644
--- a/snapshots/tng/std-widgets/overview/index.html
+++ b/snapshots/tng/std-widgets/overview/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/progressindicator/index.html b/snapshots/tng/std-widgets/progressindicator/index.html
index 6f350a994..550757550 100644
--- a/snapshots/tng/std-widgets/progressindicator/index.html
+++ b/snapshots/tng/std-widgets/progressindicator/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/scrollview/index.html b/snapshots/tng/std-widgets/scrollview/index.html
index c4b36a3ee..978073f9a 100644
--- a/snapshots/tng/std-widgets/scrollview/index.html
+++ b/snapshots/tng/std-widgets/scrollview/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/slider/index.html b/snapshots/tng/std-widgets/slider/index.html
index 1bbd3512b..b92bb7d4b 100644
--- a/snapshots/tng/std-widgets/slider/index.html
+++ b/snapshots/tng/std-widgets/slider/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/spinbox/index.html b/snapshots/tng/std-widgets/spinbox/index.html
index 3cf700ee4..d7fa2672e 100644
--- a/snapshots/tng/std-widgets/spinbox/index.html
+++ b/snapshots/tng/std-widgets/spinbox/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/spinner/index.html b/snapshots/tng/std-widgets/spinner/index.html
index 7167be905..f3ba3d02d 100644
--- a/snapshots/tng/std-widgets/spinner/index.html
+++ b/snapshots/tng/std-widgets/spinner/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/standardbutton/index.html b/snapshots/tng/std-widgets/standardbutton/index.html
index dbbe4165e..2c108eb66 100644
--- a/snapshots/tng/std-widgets/standardbutton/index.html
+++ b/snapshots/tng/std-widgets/standardbutton/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/standardlistview/index.html b/snapshots/tng/std-widgets/standardlistview/index.html
index aecfd7b93..a62190189 100644
--- a/snapshots/tng/std-widgets/standardlistview/index.html
+++ b/snapshots/tng/std-widgets/standardlistview/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/standardtableview/index.html b/snapshots/tng/std-widgets/standardtableview/index.html
index 1755234a1..0e8280a9f 100644
--- a/snapshots/tng/std-widgets/standardtableview/index.html
+++ b/snapshots/tng/std-widgets/standardtableview/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/switch/index.html b/snapshots/tng/std-widgets/switch/index.html
index 83c6e3f29..3d0cb78a5 100644
--- a/snapshots/tng/std-widgets/switch/index.html
+++ b/snapshots/tng/std-widgets/switch/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/tabwidget/index.html b/snapshots/tng/std-widgets/tabwidget/index.html
index 1f55e2723..86f747336 100644
--- a/snapshots/tng/std-widgets/tabwidget/index.html
+++ b/snapshots/tng/std-widgets/tabwidget/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/textedit/index.html b/snapshots/tng/std-widgets/textedit/index.html
index 33a32b98a..62f5f9c82 100644
--- a/snapshots/tng/std-widgets/textedit/index.html
+++ b/snapshots/tng/std-widgets/textedit/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
@@ -81,8 +81,8 @@
 		})();
 	</script> </sl-sidebar-state-persist>  <div class="md:sl-hidden"> <div class="mobile-preferences sl-flex astro-qyfhjkv4"> <div class="sl-flex social-icons astro-qyfhjkv4"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a> <ul class="isMobile astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#properties" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Properties</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#functions" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Functions</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#callbacks" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Callbacks</span> </a>  </li> </ul>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a> <ul class="astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#properties" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Properties</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#functions" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Functions</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#callbacks" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Callbacks</span> </a>  </li> </ul>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">TextEdit</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <div class="expressive-code"><link rel="stylesheet" href="/tng/_astro/ec.x2uya.css"><script type="module" src="/tng/_astro/ec.8zarh.js"></script><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">import</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#4EC9B0;--1:#227188">TextEdit</span><span style="--0:#CCCCCC;--1:#3B3B3B"> } </span><span style="--0:#569CD6;--1:#0000FF">from</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#CE9178;--1:#A31515">"std-widgets.slint"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Example</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">TextEdit</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">font-size</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">14px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#569CD6;--1:#0000FF">parent</span><span style="--0:#CCCCCC;--1:#3B3B3B">.width;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#569CD6;--1:#0000FF">parent</span><span style="--0:#CCCCCC;--1:#3B3B3B">.height;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"Lorem ipsum dolor sit amet,</span><span style="--0:#D7BA7D;--1:#D40000">\n</span><span style="--0:#CE9178;--1:#A31515"> consectetur adipisici elit"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="import { TextEdit } from &#x22;std-widgets.slint&#x22;;export component Example inherits Window {    width: 200px;    height: 200px;    TextEdit {        font-size: 14px;        width: parent.width;        height: parent.height;        text: &#x22;Lorem ipsum dolor sit amet,\n consectetur adipisici elit&#x22;;    }}"><div></div></button></div><a class="run" href="https://slintpad.com?snippet=import%20%7B%20TextEdit%20%7D%20from%20%22std-widgets.slint%22%3B%0Aexport%20component%20Example%20inherits%20Window%20%7B%0A%20%20%20%20width%3A%20200px%3B%0A%20%20%20%20height%3A%20200px%3B%0A%20%20%20%20TextEdit%20%7B%0A%20%20%20%20%20%20%20%20font-size%3A%2014px%3B%0A%20%20%20%20%20%20%20%20width%3A%20parent.width%3B%0A%20%20%20%20%20%20%20%20height%3A%20parent.height%3B%0A%20%20%20%20%20%20%20%20text%3A%20%22Lorem%20ipsum%20dolor%20sit%20amet%2C%5Cn%20consectetur%20adipisici%20elit%22%3B%0A%20%20%20%20%7D%0A%7D" target="__blank"><span>Run in Slintpad</span></a></figure></div>
-<p>Similar to <a href="lineedit"><code dir="auto">LineEdit</code></a>, but can be used to enter several lines of text</p>
+</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a> <ul class="isMobile astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#properties" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Properties</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#wrap" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">wrap</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#horizontal-alignment" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">horizontal-alignment</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#functions" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Functions</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#callbacks" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Callbacks</span> </a>  </li> </ul>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a> <ul class="astro-mncdtkjq" style="--depth: 1;"> <li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#properties" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Properties</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#wrap" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">wrap</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#horizontal-alignment" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">horizontal-alignment</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#functions" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Functions</span> </a>  </li><li class="astro-mncdtkjq" style="--depth: 1;"> <a href="#callbacks" class="astro-mncdtkjq" style="--depth: 1;"> <span class="astro-mncdtkjq" style="--depth: 1;">Callbacks</span> </a>  </li> </ul>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">TextEdit</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <div class="expressive-code"><link rel="stylesheet" href="/tng/_astro/ec.x2uya.css"><script type="module" src="/tng/_astro/ec.8zarh.js"></script><figure class="frame not-content"><figcaption class="header"></figcaption><pre data-language="slint"><code><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">import</span><span style="--0:#CCCCCC;--1:#3B3B3B"> { </span><span style="--0:#4EC9B0;--1:#227188">TextEdit</span><span style="--0:#CCCCCC;--1:#3B3B3B"> } </span><span style="--0:#569CD6;--1:#0000FF">from</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#CE9178;--1:#A31515">"std-widgets.slint"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span style="--0:#569CD6;--1:#0000FF">export</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">component</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Example</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#569CD6;--1:#0000FF">inherits</span><span style="--0:#CCCCCC;--1:#3B3B3B"> </span><span style="--0:#4EC9B0;--1:#227188">Window</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">200px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#4EC9B0;--1:#227188">TextEdit</span><span style="--0:#CCCCCC;--1:#3B3B3B"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">font-size</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#B5CEA8;--1:#08774E">14px</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">width</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#569CD6;--1:#0000FF">parent</span><span style="--0:#CCCCCC;--1:#3B3B3B">.width;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">height</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#569CD6;--1:#0000FF">parent</span><span style="--0:#CCCCCC;--1:#3B3B3B">.height;</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#9CDCFE;--1:#001080">text</span><span style="--0:#CCCCCC;--1:#3B3B3B">: </span><span style="--0:#CE9178;--1:#A31515">"Lorem ipsum dolor sit amet,</span><span style="--0:#D7BA7D;--1:#D40000">\n</span><span style="--0:#CE9178;--1:#A31515"> consectetur adipisici elit"</span><span style="--0:#CCCCCC;--1:#3B3B3B">;</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#CCCCCC;--1:#3B3B3B">    </span></span><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#CCCCCC;--1:#3B3B3B">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="import { TextEdit } from &#x22;std-widgets.slint&#x22;;export component Example inherits Window {    width: 200px;    height: 200px;    TextEdit {        font-size: 14px;        width: parent.width;        height: parent.height;        text: &#x22;Lorem ipsum dolor sit amet,\n consectetur adipisici elit&#x22;;    }}"><div></div></button></div><a class="run" href="https://slintpad.com?snippet=import%20%7B%20TextEdit%20%7D%20from%20%22std-widgets.slint%22%3B%0Aexport%20component%20Example%20inherits%20Window%20%7B%0A%20%20%20%20width%3A%20200px%3B%0A%20%20%20%20height%3A%20200px%3B%0A%20%20%20%20TextEdit%20%7B%0A%20%20%20%20%20%20%20%20font-size%3A%2014px%3B%0A%20%20%20%20%20%20%20%20width%3A%20parent.width%3B%0A%20%20%20%20%20%20%20%20height%3A%20parent.height%3B%0A%20%20%20%20%20%20%20%20text%3A%20%22Lorem%20ipsum%20dolor%20sit%20amet%2C%5Cn%20consectetur%20adipisici%20elit%22%3B%0A%20%20%20%20%7D%0A%7D" target="__blank"><span>Run in Slintpad</span></a></figure></div>
+<p>Similar to <a href="/tng/std-widgets/lineedit"><code dir="auto">LineEdit</code></a>, but can be used to enter several lines of text</p>
 <h3 id="properties">Properties</h3>
 <ul>
 <li><strong><code dir="auto">font-size</code></strong> (<em>in</em> <em>length</em>): the size of the font of the input text</li>
@@ -90,14 +90,32 @@ <h3 id="properties">Properties</h3>
 <li><strong><code dir="auto">has-focus</code></strong>: (<em>in_out</em> <em>bool</em>): Set to true when the widget currently has the focus</li>
 <li><strong><code dir="auto">enabled</code></strong>: (<em>in</em> <em>bool</em>): Defaults to true. When false, nothing can be entered</li>
 <li><strong><code dir="auto">read-only</code></strong> (<em>in</em> <em>bool</em>): When set to true, text editing via keyboard and mouse is disabled but selecting text is still enabled as well as editing text programmatically (default value: <code dir="auto">false</code>)</li>
-<li><strong><code dir="auto">wrap</code></strong> (<em>in</em> <em>enum <a href="../builtins/enums.md#textwrap"><code dir="auto">TextWrap</code></a></em>): The way the text wraps (default: word-wrap).</li>
-<li><strong><code dir="auto">horizontal-alignment</code></strong> (<em>in</em> <em>enum <a href="../builtins/enums.md#texthorizontalalignment"><code dir="auto">TextHorizontalAlignment</code></a></em>): The horizontal alignment of the text.</li>
+</ul>
+<h3 id="wrap"><code dir="auto">wrap</code></h3>
+<div class="sl-markdown-content"> <p> <strong>type:</strong> <code>enum TextWrap</code>  <br> <strong>default:</strong> <code dir="auto">the first enum value</code><br> <!-- Generated with `cargo xtask slintdocs` from internal/commons/enums.rs -->
+<p><code dir="auto">TextWrap</code></p>
+<p>This enum describes the how the text wrap if it is too wide to fit in the <a href="elements.md#text"><code dir="auto">Text</code></a> width.</p>
+<ul>
+<li><strong><code dir="auto">no-wrap</code></strong>:  The text won’t wrap, but instead will overflow.</li>
+<li><strong><code dir="auto">word-wrap</code></strong>:  The text will be wrapped at word boundaries if possible, or at any location for very long words.</li>
+<li><strong><code dir="auto">char-wrap</code></strong>:  The text will be wrapped at any character. Currently only supported by the Qt and Software renderers.</li>
+</ul>  </p> <p>The way the text wraps (default: word-wrap).</p> </div>
+<h3 id="horizontal-alignment"><code dir="auto">horizontal-alignment</code></h3>
+<div class="sl-markdown-content"> <p> <strong>type:</strong> <code>enum TextHorizontalAlignment</code>  <br> <strong>default:</strong> <code dir="auto">the first enum value</code><br> <!-- Generated with `cargo xtask slintdocs` from internal/commons/enums.rs -->
+<p><code dir="auto">TextHorizontalAlignment</code></p>
+<p>This enum describes the different types of alignment of text along the horizontal axis of a <a href="elements.md#text"><code dir="auto">Text</code></a> element.</p>
+<ul>
+<li><strong><code dir="auto">left</code></strong>:  The text will be aligned with the left edge of the containing box.</li>
+<li><strong><code dir="auto">center</code></strong>:  The text will be horizontally centered within the containing box.</li>
+<li><strong><code dir="auto">right</code></strong>:  The text will be aligned to the right of the containing box.</li>
+</ul>  </p> <p>The horizontal alignment of the text.</p> </div>
+<ul>
 <li><strong><code dir="auto">placeholder-text</code></strong>: (<em>in</em> <em>string</em>): A placeholder text being shown when there is no text in the edit field.</li>
 </ul>
 <h3 id="functions">Functions</h3>
 <ul>
 <li><strong><code dir="auto">focus()</code></strong> Call this function to focus the TextEdit and make it receive future keyboard events.</li>
-<li><strong><code dir="auto">clear-focus()</code></strong> Call this function to remove keyboard focus from this <code dir="auto">TextEdit</code> if it currently has the focus. See also <a href="../concepts/focus.md"></a>.</li>
+<li><strong><code dir="auto">clear-focus()</code></strong> Call this function to remove keyboard focus from this <code dir="auto">TextEdit</code> if it currently has the focus. See also <a href="/tng/guide/focus">focus handling</a>.</li>
 <li><strong><code dir="auto">set-selection-offsets(int, int)</code></strong> Selects the text between two UTF-8 offsets.</li>
 <li><strong><code dir="auto">select-all()</code></strong> Selects all text.</li>
 <li><strong><code dir="auto">clear-selection()</code></strong> Clears the selection.</li>
diff --git a/snapshots/tng/std-widgets/timepicker/index.html b/snapshots/tng/std-widgets/timepicker/index.html
index 4479d0692..5130c0581 100644
--- a/snapshots/tng/std-widgets/timepicker/index.html
+++ b/snapshots/tng/std-widgets/timepicker/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/std-widgets/verticalbox/index.html b/snapshots/tng/std-widgets/verticalbox/index.html
index 3c88efb3c..7cc4baca3 100644
--- a/snapshots/tng/std-widgets/verticalbox/index.html
+++ b/snapshots/tng/std-widgets/verticalbox/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
@@ -81,6 +81,6 @@
 		})();
 	</script> </sl-sidebar-state-persist>  <div class="md:sl-hidden"> <div class="mobile-preferences sl-flex astro-qyfhjkv4"> <div class="sl-flex social-icons astro-qyfhjkv4"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">VerticalBox</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <p>A <code dir="auto">VerticalBox</code> is a <a href="../elements/verticallayout"><code dir="auto">VerticalLayout</code></a> where the spacing and padding values
+</script>   </div>  </div> </div> </div> </nav> <div class="main-frame astro-ojfkrfay">   <div class="lg:sl-flex astro-32imj37r"> <aside class="right-sidebar-container astro-32imj37r"> <div class="right-sidebar astro-32imj37r"> <div class="lg:sl-hidden astro-ib7guqus"><mobile-starlight-toc data-min-h="2" data-max-h="3" class="astro-odyn52r5"><nav aria-labelledby="starlight__on-this-page--mobile" class="astro-odyn52r5"><details id="starlight__mobile-toc" class="astro-odyn52r5"><summary id="starlight__on-this-page--mobile" class="sl-flex astro-odyn52r5"><div class="toggle sl-flex astro-odyn52r5">On this page<svg aria-hidden="true" class="caret astro-odyn52r5 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg> </div><span class="display-current astro-odyn52r5"></span></summary><div class="dropdown astro-odyn52r5"><ul class="isMobile astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </div></details></nav></mobile-starlight-toc></div><div class="right-sidebar-panel sl-hidden lg:sl-block astro-ib7guqus"><div class="sl-container astro-ib7guqus"><starlight-toc data-min-h="2" data-max-h="3"><nav aria-labelledby="starlight__on-this-page"><h2 id="starlight__on-this-page">On this page</h2><ul class="astro-mncdtkjq" style="--depth: 0;"> <li class="astro-mncdtkjq" style="--depth: 0;"> <a href="#_top" class="astro-mncdtkjq" style="--depth: 0;"> <span class="astro-mncdtkjq" style="--depth: 0;">Overview</span> </a>  </li> </ul> </nav></starlight-toc></div></div> </div> </aside> <div class="main-pane astro-32imj37r">  <main data-pagefind-body lang="en" dir="ltr" class="astro-qk6vovz3">    <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <h1 id="_top" class="astro-omsebg3o">VerticalBox</h1>  </div> </div>  <div class="content-panel astro-jnkgwcet"> <div class="sl-container astro-jnkgwcet"> <div class="sl-markdown-content"> <p>A <code dir="auto">VerticalBox</code> is a <a href="/tng/elements/verticallayout"><code dir="auto">VerticalLayout</code></a> where the spacing and padding values
 depend on the style instead of defaulting to 0.</p>
-<p>See also <a href="horizontalbox"><code dir="auto">HorizontalBox</code></a>.</p> </div> <footer class="sl-flex astro-7fvjbusy"> <div class="meta sl-flex astro-7fvjbusy">   </div> <div class="pagination-links astro-s2mh7mvg" dir="ltr"> <a href="/tng/std-widgets/timepicker" rel="prev" class="astro-s2mh7mvg"> <svg aria-hidden="true" class="astro-s2mh7mvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.5rem;"><path d="M17 11H9.41l3.3-3.29a1.004 1.004 0 1 0-1.42-1.42l-5 5a1 1 0 0 0-.21.33 1 1 0 0 0 0 .76 1 1 0 0 0 .21.33l5 5a1.002 1.002 0 0 0 1.639-.325 1 1 0 0 0-.219-1.095L9.41 13H17a1 1 0 0 0 0-2Z"/></svg>  <span class="astro-s2mh7mvg"> Previous <br class="astro-s2mh7mvg"> <span class="link-title astro-s2mh7mvg">TimePickerPopup</span> </span> </a> <a href="/tng/tutorial/quickstart" rel="next" class="astro-s2mh7mvg"> <svg aria-hidden="true" class="astro-s2mh7mvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.5rem;"><path d="M17.92 11.62a1.001 1.001 0 0 0-.21-.33l-5-5a1.003 1.003 0 1 0-1.42 1.42l3.3 3.29H7a1 1 0 0 0 0 2h7.59l-3.3 3.29a1.002 1.002 0 0 0 .325 1.639 1 1 0 0 0 1.095-.219l5-5a1 1 0 0 0 .21-.33 1 1 0 0 0 0-.76Z"/></svg>  <span class="astro-s2mh7mvg"> Next <br class="astro-s2mh7mvg"> <span class="link-title astro-s2mh7mvg">Introduction</span> </span> </a> </div>   </footer>  </div> </div>   </main> </div> </div>  </div> </div>  </body></html>
\ No newline at end of file
+<p>See also <a href="/tng/std-widgets/horizontalbox"><code dir="auto">HorizontalBox</code></a>.</p> </div> <footer class="sl-flex astro-7fvjbusy"> <div class="meta sl-flex astro-7fvjbusy">   </div> <div class="pagination-links astro-s2mh7mvg" dir="ltr"> <a href="/tng/std-widgets/timepicker" rel="prev" class="astro-s2mh7mvg"> <svg aria-hidden="true" class="astro-s2mh7mvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.5rem;"><path d="M17 11H9.41l3.3-3.29a1.004 1.004 0 1 0-1.42-1.42l-5 5a1 1 0 0 0-.21.33 1 1 0 0 0 0 .76 1 1 0 0 0 .21.33l5 5a1.002 1.002 0 0 0 1.639-.325 1 1 0 0 0-.219-1.095L9.41 13H17a1 1 0 0 0 0-2Z"/></svg>  <span class="astro-s2mh7mvg"> Previous <br class="astro-s2mh7mvg"> <span class="link-title astro-s2mh7mvg">TimePickerPopup</span> </span> </a> <a href="/tng/tutorial/quickstart" rel="next" class="astro-s2mh7mvg"> <svg aria-hidden="true" class="astro-s2mh7mvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.5rem;"><path d="M17.92 11.62a1.001 1.001 0 0 0-.21-.33l-5-5a1.003 1.003 0 1 0-1.42 1.42l3.3 3.29H7a1 1 0 0 0 0 2h7.59l-3.3 3.29a1.002 1.002 0 0 0 .325 1.639 1 1 0 0 0 1.095-.219l5-5a1 1 0 0 0 .21-.33 1 1 0 0 0 0-.76Z"/></svg>  <span class="astro-s2mh7mvg"> Next <br class="astro-s2mh7mvg"> <span class="link-title astro-s2mh7mvg">Introduction</span> </span> </a> </div>   </footer>  </div> </div>   </main> </div> </div>  </div> </div>  </body></html>
\ No newline at end of file
diff --git a/snapshots/tng/tutorial/conclusion/index.html b/snapshots/tng/tutorial/conclusion/index.html
index fd076c195..da1cdc251 100644
--- a/snapshots/tng/tutorial/conclusion/index.html
+++ b/snapshots/tng/tutorial/conclusion/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/tutorial/creating_the_tiles/index.html b/snapshots/tng/tutorial/creating_the_tiles/index.html
index 95760adad..24b4b7c9f 100644
--- a/snapshots/tng/tutorial/creating_the_tiles/index.html
+++ b/snapshots/tng/tutorial/creating_the_tiles/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/tutorial/from_one_to_multiple_tiles/index.html b/snapshots/tng/tutorial/from_one_to_multiple_tiles/index.html
index 2791335a3..17b8699b7 100644
--- a/snapshots/tng/tutorial/from_one_to_multiple_tiles/index.html
+++ b/snapshots/tng/tutorial/from_one_to_multiple_tiles/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/tutorial/game_logic/index.html b/snapshots/tng/tutorial/game_logic/index.html
index 6969dc33a..7e727b6bb 100644
--- a/snapshots/tng/tutorial/game_logic/index.html
+++ b/snapshots/tng/tutorial/game_logic/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/tutorial/getting_started/index.html b/snapshots/tng/tutorial/getting_started/index.html
index c223e009d..7201368eb 100644
--- a/snapshots/tng/tutorial/getting_started/index.html
+++ b/snapshots/tng/tutorial/getting_started/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/tutorial/ideas_for_the_reader/index.html b/snapshots/tng/tutorial/ideas_for_the_reader/index.html
index d6a93ca70..ada1bbd43 100644
--- a/snapshots/tng/tutorial/ideas_for_the_reader/index.html
+++ b/snapshots/tng/tutorial/ideas_for_the_reader/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/tutorial/memory_tile/index.html b/snapshots/tng/tutorial/memory_tile/index.html
index cbc5330d1..4c94abe2c 100644
--- a/snapshots/tng/tutorial/memory_tile/index.html
+++ b/snapshots/tng/tutorial/memory_tile/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/tutorial/polishing_the_tile/index.html b/snapshots/tng/tutorial/polishing_the_tile/index.html
index f2e1c36b3..eba591b92 100644
--- a/snapshots/tng/tutorial/polishing_the_tile/index.html
+++ b/snapshots/tng/tutorial/polishing_the_tile/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/tutorial/quickstart/index.html b/snapshots/tng/tutorial/quickstart/index.html
index 7dd9c7917..f77100ed8 100644
--- a/snapshots/tng/tutorial/quickstart/index.html
+++ b/snapshots/tng/tutorial/quickstart/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;
diff --git a/snapshots/tng/tutorial/running_in_a_browser/index.html b/snapshots/tng/tutorial/running_in_a_browser/index.html
index dde0a6ca1..0d826455e 100644
--- a/snapshots/tng/tutorial/running_in_a_browser/index.html
+++ b/snapshots/tng/tutorial/running_in_a_browser/index.html
@@ -34,7 +34,7 @@
 .sl-steps{--bullet-size: calc(var(--sl-line-height) * 1rem);--bullet-margin: .375rem;list-style:none;counter-reset:steps-counter var(--sl-steps-start, 0);padding-inline-start:0}.sl-steps>li{counter-increment:steps-counter;position:relative;padding-inline-start:calc(var(--bullet-size) + 1rem);padding-bottom:1px;min-height:calc(var(--bullet-size) + var(--bullet-margin))}.sl-steps>li+li{margin-top:0}.sl-steps>li:before{content:counter(steps-counter);position:absolute;top:0;inset-inline-start:0;width:var(--bullet-size);height:var(--bullet-size);line-height:var(--bullet-size);font-size:var(--sl-text-xs);font-weight:600;text-align:center;color:var(--sl-color-white);background-color:var(--sl-color-gray-6);border-radius:99rem;box-shadow:inset 0 0 0 1px var(--sl-color-gray-5)}.sl-steps>li:after{--guide-width: 1px;content:"";position:absolute;top:calc(var(--bullet-size) + var(--bullet-margin));bottom:var(--bullet-margin);inset-inline-start:calc((var(--bullet-size) - var(--guide-width)) / 2);width:var(--guide-width);background-color:var(--sl-color-hairline-light)}.sl-steps>li>:first-child{--lh: calc(1em * var(--sl-line-height));--shift-y: calc(.5 * (var(--bullet-size) - var(--lh)));transform:translateY(var(--shift-y));margin-bottom:var(--shift-y)}.sl-steps>li>:first-child:where(h1,h2,h3,h4,h5,h6){--lh: calc(1em * var(--sl-line-height-headings))}@supports (--prop: 1lh){.sl-steps>li>:first-child{--lh: 1lh}}
 starlight-file-tree:where(.astro-otdio46d){--x-space: 1.5rem;--y-space: .125rem;--y-pad: 0;display:block;border:1px solid var(--sl-color-gray-5);padding:1rem;background-color:var(--sl-color-gray-6);font-size:var(--sl-text-xs);font-family:var(--__sl-font-mono);overflow-x:auto}starlight-file-tree:where(.astro-otdio46d) .directory>details{border:0;padding:0;padding-inline-start:var(--x-space);background:transparent}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary{margin-inline-start:calc(-1 * var(--x-space));border:0;padding:var(--y-pad) .625rem;font-weight:400;color:var(--sl-color-white);max-width:100%}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::marker,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary::-webkit-details-marker{color:var(--sl-color-gray-3)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover,starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .tree-icon{cursor:pointer;color:var(--sl-color-text-accent);fill:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover~ul{border-color:var(--sl-color-gray-4)}starlight-file-tree:where(.astro-otdio46d) .directory>details>summary:hover .highlight .tree-icon{fill:var(--sl-color-text-invert)}starlight-file-tree:where(.astro-otdio46d) ul{margin-inline-start:.5rem;border-inline-start:1px solid var(--sl-color-gray-5);padding:0;padding-inline-start:.125rem;list-style:none}starlight-file-tree:where(.astro-otdio46d)>ul{margin:0;border:0;padding:0}starlight-file-tree:where(.astro-otdio46d) li{margin:var(--y-space) 0;padding:var(--y-pad) 0}starlight-file-tree:where(.astro-otdio46d) .file{margin-inline-start:calc(var(--x-space) - .125rem);color:var(--sl-color-white)}starlight-file-tree:where(.astro-otdio46d) .tree-entry{display:inline-flex;align-items:flex-start;flex-wrap:wrap;max-width:calc(100% - 1rem)}@media (min-width: 30em){starlight-file-tree:where(.astro-otdio46d) .tree-entry{flex-wrap:nowrap}}starlight-file-tree:where(.astro-otdio46d) .tree-entry>:first-child{flex-shrink:0}starlight-file-tree:where(.astro-otdio46d) .empty{color:var(--sl-color-gray-3);padding-inline-start:.375rem}starlight-file-tree:where(.astro-otdio46d) .comment{color:var(--sl-color-gray-3);padding-inline-start:1.625rem;max-width:24rem;min-width:12rem}starlight-file-tree:where(.astro-otdio46d) .highlight{display:inline-block;border-radius:.25rem;padding-inline-end:.5rem;color:var(--sl-color-text-invert);background-color:var(--sl-color-text-accent)}starlight-file-tree:where(.astro-otdio46d) svg{display:inline;fill:var(--sl-color-gray-3);vertical-align:middle;margin-inline:.25rem .375rem;width:.875rem;height:.875rem}starlight-file-tree:where(.astro-otdio46d) .highlight svg.tree-icon{fill:var(--sl-color-text-invert)}
 .sl-link-button:where(.astro-obdgipfn){align-items:center;border:1px solid transparent;border-radius:999rem;display:inline-flex;font-size:var(--sl-text-sm);gap:.5em;line-height:1.1875;outline-offset:.25rem;padding:.4375rem 1.125rem;text-decoration:none}.sl-link-button:where(.astro-obdgipfn).primary{background:var(--sl-color-text-accent);border-color:var(--sl-color-text-accent);color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).primary:hover{color:var(--sl-color-black)}.sl-link-button:where(.astro-obdgipfn).secondary{border-color:inherit;color:var(--sl-color-white)}.sl-link-button:where(.astro-obdgipfn).minimal{color:var(--sl-color-white);padding-inline:0}.sl-link-button:where(.astro-obdgipfn) svg{flex-shrink:0}@media (min-width: 50rem){.sl-link-button:where(.astro-obdgipfn){font-size:var(--sl-text-base);padding:.9375rem 1.25rem}}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn){margin-inline-end:1rem}.sl-markdown-content .sl-link-button:where(.astro-obdgipfn):not(:where(p *)){margin-block:1rem}
-</style><script type="module" src="/tng/_astro/hoisted.DO7nuvb1.js"></script>
+</style><script type="module" src="/tng/_astro/hoisted.zHsgHwcm.js"></script>
 <script type="module" src="/tng/_astro/page.7qqag-5g.js"></script><script src="/tng/_astro/Tabs.astro_astro_type_script_index_0_lang.3nBd5krW.js" type="module"></script></head> <body class="astro-qk6vovz3"> <a href="#_top" class="astro-xsqgvdli">Skip to content</a>  <div class="page sl-flex astro-ojfkrfay"> <header class="header astro-ojfkrfay"><div class="header sl-flex astro-wucnsvza"> <div class="title-wrapper sl-flex astro-wucnsvza"> <a href="/tng/" class="site-title sl-flex astro-36pz6hta">  <img class="light:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-dark.CVr9snyL.webp" width="282" height="150"> <img class="dark:sl-hidden astro-36pz6hta" alt="" src="/tng/_astro/slint-logo-simple-light.n9-loBkR.webp" width="282" height="150"> <span class="astro-36pz6hta">  </span> </a>  </div> <div class="sl-flex astro-wucnsvza"> <site-search data-translations="{&#34;placeholder&#34;:&#34;Search&#34;}" class="astro-tzkabb26"> <button data-open-modal disabled aria-label="Search" aria-keyshortcuts="Control+K" class="astro-tzkabb26"> <svg aria-hidden="true" class="astro-tzkabb26 astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21.71 20.29 18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a.999.999 0 0 0 1.42 0 1 1 0 0 0 0-1.39ZM11 18a7 7 0 1 1 0-14 7 7 0 0 1 0 14Z"/></svg>  <span class="sl-hidden md:sl-block astro-tzkabb26" aria-hidden="true">Search</span> <kbd class="sl-hidden md:sl-flex astro-tzkabb26" style="display: none;"> <kbd class="astro-tzkabb26">Ctrl</kbd><kbd class="astro-tzkabb26">K</kbd> </kbd> </button> <dialog style="padding:0" aria-label="Search" class="astro-tzkabb26"> <div class="dialog-frame sl-flex astro-tzkabb26">  <button data-close-modal class="sl-flex md:sl-hidden astro-tzkabb26"> Cancel </button> <div class="search-container astro-tzkabb26"> <div id="starlight__search" class="astro-tzkabb26"></div> </div> </div> </dialog> </site-search>  <script>
 	(() => {
 		const openBtn = document.querySelector('button[data-open-modal]');
@@ -49,7 +49,7 @@
 	})();
 </script>    </div> <div class="sl-hidden md:sl-flex right-group astro-wucnsvza"> <div class="sl-flex social-icons astro-wucnsvza"> <a href="https://github.com/slint-ui/slint" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">GitHub</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z"/></svg> </a><a href="https://x.com/slint_ui" rel="me" class="sl-flex astro-3xi7v7sb"><span class="sr-only astro-3xi7v7sb">X</span><svg aria-hidden="true" class="astro-3xi7v7sb astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M 18.242188 2.25 L 21.554688 2.25 L 14.324219 10.507812 L 22.828125 21.75 L 16.171875 21.75 L 10.953125 14.933594 L 4.992188 21.75 L 1.679688 21.75 L 9.40625 12.914062 L 1.257812 2.25 L 8.082031 2.25 L 12.792969 8.480469 Z M 17.082031 19.773438 L 18.914062 19.773438 L 7.082031 4.125 L 5.113281 4.125 Z M 17.082031 19.773438 "/></svg> </a> </div> <starlight-theme-select>  <label style="--sl-select-width: 6.25em" class="astro-dja2gvdd"> <span class="sr-only astro-dja2gvdd">Select theme</span> <svg aria-hidden="true" class="icon label-icon astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M21 14h-1V7a3 3 0 0 0-3-3H7a3 3 0 0 0-3 3v7H3a1 1 0 0 0-1 1v2a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3v-2a1 1 0 0 0-1-1ZM6 7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7H6V7Zm14 10a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1v-1h16v1Z"/></svg>  <select value="auto" class="astro-dja2gvdd"> <option value="dark" class="astro-dja2gvdd">Dark</option><option value="light" class="astro-dja2gvdd">Light</option><option value="auto" selected class="astro-dja2gvdd">Auto</option> </select> <svg aria-hidden="true" class="icon caret astro-dja2gvdd astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M17 9.17a1 1 0 0 0-1.41 0L12 12.71 8.46 9.17a1 1 0 1 0-1.41 1.42l4.24 4.24a1.002 1.002 0 0 0 1.42 0L17 10.59a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </label>  </starlight-theme-select>  <script>
 	StarlightThemeProvider.updatePickers();
-</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="07s74km" class="astro-jevrrhio"> <script>
+</script>   </div> </div> </header> <nav class="sidebar astro-ojfkrfay" aria-label="Main"> <starlight-menu-button class="astro-l6rc6h3h"> <button aria-expanded="false" aria-label="Menu" aria-controls="starlight__sidebar" class="sl-flex md:sl-hidden astro-l6rc6h3h"> <svg aria-hidden="true" class="astro-l6rc6h3h astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1em;"><path d="M3 8h18a1 1 0 1 0 0-2H3a1 1 0 0 0 0 2Zm18 8H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Zm0-5H3a1 1 0 0 0 0 2h18a1 1 0 0 0 0-2Z"/></svg>  </button> </starlight-menu-button>    <div id="starlight__sidebar" class="sidebar-pane astro-ojfkrfay"> <div class="sidebar-content sl-flex astro-ojfkrfay"> <sl-sidebar-state-persist data-hash="1v6c8s7" class="astro-jevrrhio"> <script>
 		(() => {
 			try {
 				if (!matchMedia('(min-width: 50em)').matches) return;
@@ -72,7 +72,7 @@
 				);
 			} catch {}
 		})();
-	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
+	</script>  <ul class="top-level astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/overview" class="large astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="0"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Getting started</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/getting-started/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Welcome</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/getting-started/which_language" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Which language?</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="1"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Guide</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/guide/intro" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/preview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Live Preview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/basics" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Basics</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/guide/types" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Types</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="2"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Elements Reference</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/elements/dialog/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Dialog</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/flickable/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Flickable</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/focusscope/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">FocusScope</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/gridlayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/horizontallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/image/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Image</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/path/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Path</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/popupwindow/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">PopupWindow</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/rectangle/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rectangle</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/swipegestrurehandler/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SwipeGestureHandler</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/text/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Text</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/textinput/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextInput</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/timer/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Timer</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/toucharea/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TouchArea</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/verticallayout/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalLayout</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/elements/window/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Window</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="3"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Std-Widgets</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/std-widgets/overview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Overview</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/aboutslint" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">AboutSlint</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/button" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Button</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/checkbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">CheckBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/combobox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ComboBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/datepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">DataPickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/gridbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GridBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/groupbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">GroupBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/horizontalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">HorizontalBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/lineedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">LineEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/listview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/progressindicator" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ProgressIndicator</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/scrollview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">ScrollView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/slider" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Slider</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">SpinBox</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/spinner" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Spinner</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardbutton" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardButton</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardlistview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardListView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/standardtableview" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">StandardTableView</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/switch" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Switch</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/tabwidget" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TabWidget</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/textedit" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TextEdit</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/timepicker" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TimePickerPopup</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/std-widgets/verticalbox" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">VerticalBox</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details open class="astro-gwinrdvg"> <sl-sidebar-restore data-index="4"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Tutorial</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="/tng/tutorial/quickstart" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Introduction</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/getting_started" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Getting Started</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/memory_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Memory Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/polishing_the_tile" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Polishing The Tile</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/from_one_to_multiple_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">From One To Multiple Tiles</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/creating_the_tiles" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Creating The Tiles From Code</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/game_logic" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Game Logic</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/running_in_a_browser" aria-current="page" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Running In A Browser</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/ideas_for_the_reader" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Ideas For The Reader</span>  </a> </li><li class="astro-gwinrdvg"> <a href="/tng/tutorial/conclusion" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Conclusion</span>  </a> </li> </ul>  </details> </li><li class="astro-gwinrdvg"> <details class="astro-gwinrdvg"> <sl-sidebar-restore data-index="5"></sl-sidebar-restore> <summary class="astro-gwinrdvg"> <div class="group-label astro-gwinrdvg"> <span class="large astro-gwinrdvg">Native API</span>  </div> <svg aria-hidden="true" class="caret astro-gwinrdvg astro-bncqquy7" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" style="--sl-icon-size: 1.25rem;"><path d="m14.83 11.29-4.24-4.24a1 1 0 1 0-1.42 1.41L12.71 12l-3.54 3.54a1 1 0 0 0 0 1.41 1 1 0 0 0 .71.29 1 1 0 0 0 .71-.29l4.24-4.24a1.002 1.002 0 0 0 0-1.42Z"/></svg>  </summary> <ul class="astro-gwinrdvg"> <li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/cpp/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">C++ ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://pypi.org/project/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Python ↗</span> <span class="sl-badge caution small  astro-gwinrdvg astro-sudhlwkh">beta</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/rust/slint/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">Rust ↗</span>  </a> </li><li class="astro-gwinrdvg"> <a href="https://docs.slint.dev/latest/docs/node/" class="astro-gwinrdvg"> <span class="astro-gwinrdvg">TypeScript ↗</span>  </a> </li> </ul>  </details> </li> </ul>   <script>
 		(() => {
 			const scroller = document.getElementById('starlight__sidebar');
 			if (!window._starlightScrollRestore || !scroller) return;