Update frontend components for accessibility and functionality improvements

- Modified docker-compose.dev.yml to conditionally run npm install based on the presence of package-lock.json.
- Upgraded Nuxt version in package-lock.json from 3.21.1 to 4.3.1 for enhanced features.
- Enhanced ConfirmModal component with aria-modal attribute for better accessibility.
- Updated MapErrorBoundary component's error message for clarity.
- Added role and aria-label attributes to MapView and MapSearch components for improved screen reader support.
- Refactored various components to manage focus behavior on modal close, enhancing user experience.
- Improved ToastContainer styling for better responsiveness and visibility.
- Updated layout components to include skip navigation links for improved accessibility.

frontend-nuxt/pages/admin/index.vue

@@ -107,21 +107,21 @@
             <table class="table table-sm table-zebra min-w-[32rem]">
               <thead>
                 <tr>
-                  <th>
+                  <th scope="col">
                     <button type="button" class="btn btn-ghost btn-xs gap-0.5 min-h-9 touch-manipulation" :class="mapsSortBy === 'ID' ? 'btn-active' : ''" @click="setMapsSort('ID')">
                       ID
                       <span v-if="mapsSortBy === 'ID'" class="opacity-70">{{ mapsSortDir === 'asc' ? '↑' : '↓' }}</span>
                     </button>
                   </th>
-                  <th>
+                  <th scope="col">
                     <button type="button" class="btn btn-ghost btn-xs gap-0.5 min-h-9 touch-manipulation" :class="mapsSortBy === 'Name' ? 'btn-active' : ''" @click="setMapsSort('Name')">
                       Name
                       <span v-if="mapsSortBy === 'Name'" class="opacity-70">{{ mapsSortDir === 'asc' ? '↑' : '↓' }}</span>
                     </button>
                   </th>
-                  <th>Hidden</th>
-                  <th>Priority</th>
-                  <th class="text-right"></th>
+                  <th scope="col">Hidden</th>
+                  <th scope="col">Priority</th>
+                  <th scope="col" class="text-right"></th>
                 </tr>
               </thead>
               <tbody>
@@ -241,8 +241,10 @@
     <div
       v-if="rebuilding || merging || wiping"
       class="fixed inset-0 z-50 flex items-center justify-center bg-base-100/80 backdrop-blur-sm"
+      role="status"
       aria-live="polite"
       aria-busy="true"
+      :aria-label="rebuilding ? 'Rebuilding zooms in progress' : merging ? 'Merging in progress' : 'Wiping data in progress'"
     >
       <div class="flex flex-col items-center gap-4 p-6 rounded-xl bg-base-200 border border-base-300 shadow-2xl">
         <span class="loading loading-spinner loading-lg text-primary" />
@@ -279,6 +281,7 @@
 import type { MapInfoAdmin } from '~/types/api'
 
 definePageMeta({ middleware: 'admin' })
+useHead({ title: 'Admin – HnH Map' })
 
 const api = useMapApi()
 const toast = useToast()