test

src/js/04-page-versions.js

@@ -5,11 +5,12 @@
   if (!toggle) return
 
   var selector = document.querySelector('.page-versions')
-  console.log('page-versions >>>>>', selector)
   var backdrop = document.querySelector('.backdrop')
   var versionMenu = document.querySelector('.version-menu')
   var versions = versionMenu?.querySelectorAll('.version')
-  console.log('version >>>>>', versions)
+  const componentsData = document.querySelector('[data-components]').dataset.component
+  const componentData = document.querySelector('[data-component]').dataset.component
+  console.log(componentsData, componentData)
 
   toggle.addEventListener('click', function (e) {
     if (!versions.length) return

src/partials/page-versions.hbs

@@ -5,11 +5,11 @@
   <h2 class="title"><a href="{{{relativize ./url}}}">{{page.component.title}}</a></h2>
   <button class="version-menu-toggle" title="Show other versions of page">{{#if (or page.componentVersion.version (ne page.componentVersion.displayVersion 'default'))}}v{{page.componentVersion.displayVersion}}{{/if}}</button>
   {{#with site.components.[0]}}
-  <div class="version-menu">
+  <div class="version-menu" data-components="{{site.components}}" data-component="{{site.components.[0]}}">
     {{#each ./versions}}
     <a class="version
-      {{~#if (eq ./version @root.page.version)}} is-current{{/if~}}
-      {{!-- {{~#if (and (eq .. @root.page.component) (eq this @root.page.componentVersion))}} is-current{{/if~}} --}}
+      {{!-- {{~#if (eq ./version @root.page.version)}} is-current{{/if~}} --}}
+      {{~#if (and (eq .. @root.page.component) (eq this @root.page.componentVersion))}} is-current{{/if~}}
       {{~#if ./missing}} is-missing{{/if}}" href="{{{relativize ./url}}}">v{{./displayVersion}}</a>
     {{/each}}
   </div>