refactor: rename 'recit' to 'narrative' for English code naming

- Rename store: recit.js → narrative.js (useRecitStore → useNarrativeStore)
- Rename templates: recit.php/json.php → narrative.php/json.php
- Rename blueprint: recit.yml → narrative.yml
- Update all imports and references in Vue/JS files
- Update PHP template references and data attributes
- Update CLAUDE.md documentation
- Create comprehensive README.md with English-French dictionary

The dictionary section maps English code terms to French content terms
for easier navigation between codebase and CMS content.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

src/App.vue

@@ -6,14 +6,14 @@ import PagePopup from './components/PagePopup.vue';
 import PreviewLoader from './components/PreviewLoader.vue';
 import { onMounted, ref, watch, computed, provide } from 'vue';
 import { useStylesheetStore } from './stores/stylesheet';
-import { useRecitStore } from './stores/recit';
+import { useNarrativeStore } from './stores/narrative';
 import Coloris from '@melloware/coloris';
 
 const stylesheetStore = useStylesheetStore();
-const recitStore = useRecitStore();
+const narrativeStore = useNarrativeStore();
 
-// Get recit URL from body data attribute (set by print.php template)
-const recitUrl = document.body.dataset.recitUrl || null;
+// Get narrative URL from body data attribute (set by print.php template)
+const narrativeUrl = document.body.dataset.narrativeUrl || null;
 const previewFrame1 = ref(null);
 const previewFrame2 = ref(null);
 const elementPopup = ref(null);
@@ -488,11 +488,11 @@ watch(
   }
 );
 
-// Re-render when recit data changes
+// Re-render when narrative data changes
 watch(
-  () => recitStore.data,
+  () => narrativeStore.data,
   () => {
-    if (recitStore.data) {
+    if (narrativeStore.data) {
       renderPreview();
     }
   }
@@ -558,9 +558,9 @@ const printPreview = async () => {
 };
 
 onMounted(async () => {
-  // Load recit data if URL is provided (print mode)
-  if (recitUrl) {
-    await recitStore.loadRecit(recitUrl);
+  // Load narrative data if URL is provided (print mode)
+  if (narrativeUrl) {
+    await narrativeStore.loadNarrative(narrativeUrl);
   }
 
   // Render preview after data is loaded

src/components/PagedJsWrapper.vue

@@ -1,6 +1,6 @@
 <template>
-  <!-- Fallback static content when no recit data -->
-  <template v-if="!hasRecitData">
+  <!-- Fallback static content when no narrative data -->
+  <template v-if="!hasNarrativeData">
     <section class="chapter">
       <p>
         Accumsan arcu tristique purus eros pellentesque rutrum hendrerit
@@ -10,13 +10,13 @@
     </section>
   </template>
 
-  <!-- Dynamic content from recit -->
+  <!-- Dynamic content from narrative -->
   <template v-else>
     <template v-for="item in flattenedContent" :key="item.id">
-      <!-- Récit (cover page) -->
+      <!-- Narrative (cover page) -->
       <section
-        v-if="item.template === 'recit'"
-        class="recit-cover"
+        v-if="item.template === 'narrative'"
+        class="narrative-cover"
         :data-page-type="item.template"
       >
         <img v-if="item.cover" :src="item.cover" class="cover-image" alt="" />
@@ -75,7 +75,7 @@
 
 <script setup>
 import { computed } from 'vue';
-import { useRecitStore } from '../stores/recit';
+import { useNarrativeStore } from '../stores/narrative';
 import {
   TextBlock,
   HeadingBlock,
@@ -87,10 +87,10 @@ import {
   blockComponents
 } from './blocks';
 
-const recitStore = useRecitStore();
+const narrativeStore = useNarrativeStore();
 
-const hasRecitData = computed(() => recitStore.data !== null);
-const flattenedContent = computed(() => recitStore.flattenedContent);
+const hasNarrativeData = computed(() => narrativeStore.data !== null);
+const flattenedContent = computed(() => narrativeStore.flattenedContent);
 
 // Filter out hidden blocks
 const visibleBlocks = (blocks) => {
@@ -114,24 +114,24 @@ const getBlockComponent = (type) => {
 
 <style>
 /* Base print styles for content sections */
-.recit-cover,
+.narrative-cover,
 .geoformat,
 .chapitre,
 .carte {
   break-before: page;
 }
 
-.recit-cover .cover-image,
+.narrative-cover .cover-image,
 .geoformat .cover-image {
   max-width: 100%;
   height: auto;
 }
 
-.recit-cover h1 {
+.narrative-cover h1 {
   margin-top: 1rem;
 }
 
-.recit-cover .author {
+.narrative-cover .author {
   font-style: italic;
   color: #666;
 }

src/stores/narrative.js

@@ -1,7 +1,7 @@
 import { defineStore } from 'pinia';
 import { ref, computed } from 'vue';
 
-export const useRecitStore = defineStore('recit', () => {
+export const useNarrativeStore = defineStore('narrative', () => {
   const data = ref(null);
   const loading = ref(false);
   const error = ref(null);
@@ -19,10 +19,10 @@ export const useRecitStore = defineStore('recit', () => {
 
     const items = [];
 
-    // Add recit intro as first section
+    // Add narrative intro as first section
     items.push({
       id: data.value.id,
-      template: 'recit',
+      template: 'narrative',
       title: data.value.title,
       author: data.value.author,
       cover: data.value.cover,
@@ -72,10 +72,10 @@ export const useRecitStore = defineStore('recit', () => {
     return items;
   });
 
-  // Load recit data from URL
-  const loadRecit = async (url) => {
+  // Load narrative data from URL
+  const loadNarrative = async (url) => {
     if (!url) {
-      error.value = 'No recit URL provided';
+      error.value = 'No narrative URL provided';
       return;
     }
 
@@ -91,7 +91,7 @@ export const useRecitStore = defineStore('recit', () => {
 
       data.value = await response.json();
     } catch (e) {
-      console.error('Error loading recit:', e);
+      console.error('Error loading narrative:', e);
       error.value = e.message;
       data.value = null;
     } finally {
@@ -121,7 +121,7 @@ export const useRecitStore = defineStore('recit', () => {
     flattenedContent,
 
     // Actions
-    loadRecit,
+    loadNarrative,
     reset
   };
 });