starlight-versions 0.2.0 → 0.3.1

package/components/VersionSearch.astro

@@ -13,12 +13,12 @@ import starlightVersionsConfig from 'virtual:starlight-versions-config'
 
 import { getVersionFromSlug, getVersionIdentifier, getVersionURL } from '../libs/versions'
 
-const { entry, labels } = Astro.props
+const { entry } = Astro.props
 
 const pagefindTranslations = {
-  placeholder: labels['search.label'],
+  placeholder: Astro.locals.t('search.label'),
   ...Object.fromEntries(
-    Object.entries(labels)
+    Object.entries(Astro.locals.t.all())
       .filter(([key]) => key.startsWith('pagefind.'))
       .map(([key, value]) => [key.replace('pagefind.', ''), value]),
   ),
@@ -35,20 +35,20 @@ const pageVersionIdentifier = getVersionIdentifier(pageVersion)
   data-pagefind-filter={`version:${pageVersionIdentifier}`}
 >
   <button data-open-modal disabled>
-    <Icon name="magnifier" label={labels['search.label']} />
-    <span class="sl-hidden md:sl-block" aria-hidden="true">{labels['search.label']}</span>
-    <Icon name="forward-slash" class="sl-hidden md:sl-block" label={labels['search.shortcutLabel']} />
+    <Icon name="magnifier" label={Astro.locals.t('search.label')} />
+    <span class="sl-hidden md:sl-block" aria-hidden="true">{Astro.locals.t('search.label')}</span>
+    <Icon name="forward-slash" class="sl-hidden md:sl-block" label={Astro.locals.t('search.shortcutLabel')} />
   </button>
 
-  <dialog style="padding:0" aria-label={labels['search.label']}>
+  <dialog style="padding:0" aria-label={Astro.locals.t('search.label')}>
     <div class="dialog-frame sl-flex">
       <button data-close-modal class="sl-flex md:sl-hidden">
-        {labels['search.cancelLabel']}
+        {Astro.locals.t('search.cancelLabel')}
       </button>
       {
         import.meta.env.DEV ? (
           <div style="margin: auto; text-align: center; white-space: pre-line;" dir="ltr">
-            <p>{labels['search.devWarning']}</p>
+            <p>{Astro.locals.t('search.devWarning')}</p>
           </div>
         ) : (
           <div class="search-container">

package/components/VersionSelect.astro

@@ -15,7 +15,7 @@ const pageVersion = getVersionFromSlug(starlightVersionsConfig, starlightConfig,
   <label>
     <span class="sr-only">Select version</span>
     <Icon name="seti:clock" class="icon label-icon" />
-    <select value={pageVersion?.label ?? 'current'}>
+    <select value={pageVersion?.label ?? 'current'} autocomplete="off">
       <option
         selected={pageVersion === undefined}
         value={getVersionURL(starlightVersionsConfig, starlightConfig, Astro.url, undefined).pathname}
@@ -101,11 +101,25 @@ const pageVersion = getVersionFromSlug(starlightVersionsConfig, starlightConfig,
       constructor() {
         super()
 
-        this.querySelector('select')?.addEventListener('change', (event) => {
+        const select = this.querySelector('select')
+        if (!select) return
+
+        select?.addEventListener('change', (event) => {
           if (event.currentTarget instanceof HTMLSelectElement) {
             window.location.pathname = event.currentTarget.value
           }
         })
+
+        window.addEventListener('pageshow', (event) => {
+          if (!event.persisted) return
+          const markupSelectedIndex = select.querySelector<HTMLOptionElement>('option[selected]')?.index
+
+          // If the page was loaded from a cache, the version select selected index might not be in sync with the
+          // current page.
+          if (markupSelectedIndex !== select.selectedIndex) {
+            select.selectedIndex = markupSelectedIndex ?? 0
+          }
+        })
       }
     },
   )

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "starlight-versions",
-  "version": "0.2.0",
+  "version": "0.3.1",
   "license": "MIT",
   "description": "Starlight plugin to version documentation pages.",
   "author": "HiDeoo <github@hideoo.dev> (https://hideoo.dev)",
@@ -40,7 +40,7 @@
     "vitest": "^1.6.0"
   },
   "peerDependencies": {
-    "@astrojs/starlight": ">=0.25.0"
+    "@astrojs/starlight": ">=0.28.0"
   },
   "engines": {
     "node": ">=18"