Portfolio Artistique — Nuxt 3 + Sanity CMS

1// Composables/useModal.ts - Gestion du modal avec navigation
2  const currentIndex = ref(0);
3  const paintings = ref<Painting[]>([]);
4
5  function openModal(index: number) {
6    currentIndex.value = index;
7    document.body.style.overflow = 'hidden';
8    
9    // Précharger images adjacentes
10    preloadAdjacentImages(index);
11  }
12
13  function navigate(direction: 'prev' | 'next') {
14    if (direction === 'prev' && currentIndex.value > 0) {
15      currentIndex.value--;
16    } else if (direction === 'next' && currentIndex.value < paintings.value.length - 1) {
17      currentIndex.value++;
18    }
19    preloadAdjacentImages(currentIndex.value);
20  }
21
22  // Support navigation clavier
23  onMounted(() => {
24    window.addEventListener('keydown', (e) => {
25      if (e.key === 'ArrowLeft') navigate('prev');
26      if (e.key === 'ArrowRight') navigate('next');
27      if (e.key === 'Escape') closeModal();
28    });
29  });