Merge branch 'next' of https://github.com/shoelace-style/webawesome into konnorrogers/fixing-layout-z-index-stuff

docs/_layouts/theme.njk

@@ -25,8 +25,8 @@ wa_data.palettes = {
   {% endfor %}
 };
 </script>
-<link href="{{ page.url }}../remix.css" rel="stylesheet">
-<script src="{{ page.url }}../remix.js" type="module"></script>
+<link href="/docs/themes/remix.css" rel="stylesheet">
+<script src="/docs/themes/remix.js" type="module"></script>
 {% endblock %}
 
 {% block header %}

docs/docs/themes/remix.js

@@ -30,8 +30,8 @@ function init() {
 
   codeSnippets = document.querySelector('#usage ~ wa-tab-group.import-stylesheet-code:first-of-type');
   codeSnippets = {
-    html: codeSnippets.querySelector('code.language-html'),
-    css: codeSnippets.querySelector('code.language-css'),
+    html: codeSnippets?.querySelector('code.language-html'),
+    css: codeSnippets?.querySelector('code.language-css'),
   };
 
   data = {
@@ -73,10 +73,10 @@ function init() {
 
   Promise.all(Object.values(selects).map(select => select.updateComplete)).then(() => render());
 
-  return { selects, codeSnippets, data, computed, render };
+  globalThis.remixApp = { selects, codeSnippets, data, computed, render };
 }
 
-globalThis.remixApp = init();
+init()
 
 // Async load CSS for other themes *before* current theme stylesheet
 let themeStylesheet = document.querySelector('#theme-stylesheet');
@@ -157,6 +157,5 @@ function render(changedAspect) {
   }
 }
 
-addEventListener('turbo:render', event => {
-  remixApp = init();
-});
+// make sure to use a stable function reference here.
+addEventListener('turbo:render', init)