ontowave 1.0.0

package/dist/ontowave.min.js

@@ -0,0 +1,1278 @@
+(d=>{let o={fr:{menuHome:"Accueil",menuGallery:"Galerie",menuConfiguration:"Configuration",configTitle:"OntoWave - Configuration Complète",configGeneral:"Général",configSiteTitle:"Titre du site :",configDefaultPage:"Page par défaut :",configBaseUrl:"URL de base :",configLanguages:"Langues et Localisation",configSupportedLanguages:"Langues supportées (séparées par des virgules) :",configFallbackLanguage:"Langue de fallback :",configNavigation:"Navigation et Interface",configShowGallery:"Afficher la galerie d'exemples",configHomeButton:"Bouton Accueil",configBreadcrumb:"Fil d'Ariane (breadcrumb)",configToc:"Table des matières",configMermaid:"Diagrammes Mermaid",configMermaidTheme:"Thème Mermaid :",configMermaidAuto:"Démarrage automatique",configMermaidMaxWidth:"Utiliser la largeur maximale",configPlantuml:"Diagrammes PlantUML",configPlantumlServer:"Serveur PlantUML :",configPlantumlFormat:"Format de sortie :",configPrism:"Coloration Syntaxique (Prism.js)",configPrismTheme:"Thème Prism :",configPrismAutoload:"Chargement automatique",configUI:"Interface Utilisateur",configUITheme:"Thème de l'interface :",configUIResponsive:"Design responsive",configUIAnimations:"Animations et transitions",configApply:"Appliquer Configuration",configDownloadHTML:"Télécharger HTML",configDownloadJS:"Télécharger ontowave.min.js",configReset:"Réinitialiser",configLanguageNote:"Laissez vide pour un site monolingue"},en:{menuHome:"Home",menuGallery:"Gallery",menuConfiguration:"Configuration",configTitle:"OntoWave - Complete Configuration",configGeneral:"General",configSiteTitle:"Site title:",configDefaultPage:"Default page:",configBaseUrl:"Base URL:",configLanguages:"Languages and Localization",configSupportedLanguages:"Supported languages (comma separated):",configFallbackLanguage:"Fallback language:",configNavigation:"Navigation and Interface",configShowGallery:"Show examples gallery",configHomeButton:"Home button",configBreadcrumb:"Breadcrumb navigation",configToc:"Table of contents",configMermaid:"Mermaid Diagrams",configMermaidTheme:"Mermaid theme:",configMermaidAuto:"Auto start",configMermaidMaxWidth:"Use maximum width",configPlantuml:"PlantUML Diagrams",configPlantumlServer:"PlantUML server:",configPlantumlFormat:"Output format:",configPrism:"Syntax Highlighting (Prism.js)",configPrismTheme:"Prism theme:",configPrismAutoload:"Auto loading",configUI:"User Interface",configUITheme:"Interface theme:",configUIResponsive:"Responsive design",configUIAnimations:"Animations and transitions",configApply:"Apply Configuration",configDownloadHTML:"Download HTML",configDownloadJS:"Download ontowave.min.js",configReset:"Reset",configLanguageNote:"Leave empty for monolingual site"}},t={title:"OntoWave Documentation",baseUrl:"/",defaultPage:"index.md",containerId:"ontowave-container",locales:["fr","en"],fallbackLocale:"en",showGallery:!1,mermaid:{theme:"default",startOnLoad:!0,flowchart:{useMaxWidth:!0},sequence:{useMaxWidth:!0},gantt:{useMaxWidth:!0},journey:{useMaxWidth:!0}},plantuml:{server:"https://www.plantuml.com/plantuml",format:"svg"},prism:{theme:"default",autoload:!0},navigation:{showHome:!0,showBreadcrumb:!0,showToc:!0},ui:{theme:"default",responsive:!0,animations:!0,languageButtons:"menu"}};class n{constructor(e={}){this.config={...t,...e},e.i18n&&(e.i18n.supported&&(this.config.locales=e.i18n.supported),e.i18n.default)&&(this.config.fallbackLocale=e.i18n.default),this.container=null,this.mermaidLoaded=!1,this.prismLoaded=!1,this.currentPage=null,this.currentLanguage=null}getCurrentLanguage(){if(this.currentLanguage)return this.currentLanguage;var e=document.getElementById("lang-fr"),t=document.getElementById("lang-en");if(e&&t){if(e.classList.contains("visible")||!e.classList.contains("hidden")&&"none"!==e.style.display)return"fr";if(t.classList.contains("visible")||!t.classList.contains("hidden")&&"none"!==t.style.display)return"en"}e=document.getElementById("btn-fr"),t=document.getElementById("btn-en");if(e&&t){if(e.classList.contains("active"))return"fr";if(t.classList.contains("active"))return"en"}return this.resolveLocale()||"en"}t(e,t=null){t=t||this.getCurrentLanguage();return(o[t]||o.en)[e]||e}updateInterfaceTexts(e=null){let t=e||this.getCurrentLanguage();console.log("🌐 Interface texts updating for language:",t);e=document.querySelector('.ontowave-menu-option[onclick*="goHome"]'),e&&(e.innerHTML="🏠 "+this.t("menuHome",t)),e=document.querySelector('.ontowave-menu-option[onclick*="gallery.html"]'),e&&(e.innerHTML="🎨 "+this.t("menuGallery",t)),e=document.querySelector('.ontowave-menu-option[onclick*="toggleConfigurationPanel"]'),e&&(e.innerHTML="⚙️ "+this.t("menuConfiguration",t)),e=document.getElementById("ontowave-config-panel");if(e){let n=document.getElementById("config-title-full")?.value||this.config.title,i=document.getElementById("config-defaultPage-full")?.value||this.config.defaultPage,a=document.getElementById("config-baseUrl-full")?.value||this.config.baseUrl;e.remove();e=document.querySelector('.ontowave-menu-option[onclick*="toggleConfigurationPanel"]');e&&e.classList.remove("selected"),setTimeout(()=>{this.toggleConfigurationPanel(null,t),setTimeout(()=>{var e=document.getElementById("config-title-full"),t=document.getElementById("config-defaultPage-full"),o=document.getElementById("config-baseUrl-full");e&&(e.value=n),t&&(t.value=i),o&&(o.value=a)},100)},50)}console.log("🌐 Interface texts updated for language:",t)}switchLanguage(e){this.currentLanguage=e,this.updateLanguageButtonsState(e),this.updateInterfaceTexts(e);e=(this.config.sources||{})[e]||this.config.defaultPage;e&&this.loadPage(e)}updateLanguageButtonsState(e=null){let t=e||this.getCurrentLanguage();document.querySelectorAll(".ontowave-lang-btn").forEach(e=>{e.classList.remove("active"),e.textContent.includes(t.toUpperCase())&&e.classList.add("active")}),document.querySelectorAll(".ontowave-fixed-lang-btn").forEach(e=>{e.classList.remove("active"),e.textContent.includes(t.toUpperCase())&&e.classList.add("active")}),console.log("🌐 État des boutons de langue mis à jour pour:",t)}goHome(){var e=this.getCurrentLanguage(),e=(this.config.sources||{})[e]||this.config.defaultPage;this.loadPage(e)}getBrowserLocales(){var e=[];return navigator.languages&&e.push(...navigator.languages),navigator.language&&e.push(navigator.language),navigator.userLanguage&&e.push(navigator.userLanguage),[...new Set(e)]}resolveLocale(){var e=this.getBrowserLocales(),o=this.config.locales||[],t=this.config.defaultLocale||this.config.fallbackLocale;if(console.log("🌐 Browser locales:",e),console.log("🌐 Supported locales:",o),console.log("🌐 Default locale:",t),0===o.length)return null;var n,i,a,l=d.location.hash||d.location.pathname;console.log("🔍 Current URL:",l);for(n of o)if(new RegExp(`\\.${n}\\.(md|html)`).test(l))return console.log("🎯 Page language detected from URL:",n,"in",l),n;for(i of e)if(o.includes(i))return console.log("🎯 Exact browser match found:",i),i;for(a of e){var r;a.split("-")[0];for(r of e){let t=r.split("-")[0];var s=o.find(e=>e.startsWith(t));if(s)return console.log("🎯 Prefix match found:",r,"->",s),s}if(t&&o.includes(t))return console.log("🎯 Using configured default locale:",t),t}var c=o[0];return console.log("🎯 Using fallback locale:",c),c}isMultilingualMode(){return this.config.locales&&0<this.config.locales.length&&this.config.sources}generatePageCandidates(e){var t,o=this.resolveLocale(),n=[];return o?(t=e.replace(/\.md$/,""),n.push(t+`.${o}.md`),o.includes("-")&&(o=o.split("-")[0],n.push(t+`.${o}.md`)),n.push(e),console.log("📄 Page candidates for",e,":",n)):n.push(e),n}async init(){try{await this.loadConfigFromScript(),this.injectStyles(),await this.loadMermaid(),await this.loadPrism(),this.createInterface(),this.currentLanguage=this.resolveLocale(),this.initializeNavigation(),this.updateLanguageButtonsState(),await this.loadInitialPage(),console.log("✅ OntoWave successfully initialized")}catch(e){console.error("❌ OntoWave initialization failed:",e),this.showError("Erreur d'initialisation OntoWave: "+e.message)}}async loadConfigFromScript(){if(d.ontoWaveConfig)this.config={...this.config,...d.ontoWaveConfig},console.log("📄 Configuration loaded from window.ontoWaveConfig"),console.log("📄 Final config:",this.config);else{var e=document.getElementById("ontowave-config");if(e&&"application/json"===e.type)try{var t=JSON.parse(e.textContent);this.config={...this.config,...t},console.log("📄 Configuration loaded from script tag"),console.log("📄 Final config:",this.config)}catch(e){console.warn("⚠️ Invalid JSON in ontowave-config script tag:",e)}}}injectStyles(){var e=document.createElement("style");e.textContent=`
+    .ontowave-container {
+      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
+      line-height: 1.6;
+      color: #24292e;
+      background: #fff;
+      margin: 0;
+      padding: 20px;
+      min-height: 100vh;
+    }
+    
+    /* Menu flottant minimal déplaçable */
+    .ontowave-floating-menu {
+      position: fixed;
+      top: 20px;
+      left: 20px;
+      z-index: 1000;
+      background: rgba(255, 255, 255, 0.95);
+      backdrop-filter: blur(10px);
+      border: 1px solid #e1e4e8;
+      border-radius: 44px;
+      padding: 10px;
+      box-shadow: 0 4px 12px rgba(27,31,35,0.15);
+      cursor: move;
+      transition: all 0.3s ease;
+      font-size: 1.2em;
+      user-select: none;
+      display: flex;
+      align-items: center;
+      gap: 0;
+      width: 44px;
+      height: 44px;
+      overflow: visible;
+      white-space: nowrap;
+    }
+    
+    .ontowave-floating-menu.no-drag {
+      cursor: default;
+    }
+    
+    .ontowave-floating-menu.expanded {
+      width: auto;
+      height: auto;
+      min-height: 44px;
+      border-radius: 22px;
+      padding: 10px 18px;
+      gap: 10px;
+    }
+    
+    .ontowave-floating-menu:hover {
+      transform: scale(1.05);
+      box-shadow: 0 6px 20px rgba(27,31,35,0.25);
+    }
+    
+    /* Désactiver le zoom quand le panneau de configuration est ouvert */
+    .ontowave-floating-menu.has-config-panel:hover {
+      transform: none;
+    }
+    
+    .ontowave-menu-icon {
+      cursor: pointer;
+      transition: transform 0.3s ease;
+      flex-shrink: 0;
+      width: 30px;
+      height: 30px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 1.4em;
+      text-align: center;
+      line-height: 1;
+      margin: 0 auto;
+    }
+    
+    .ontowave-menu-icon:hover {
+      transform: scale(1.2);
+    }
+    
+    .ontowave-menu-content {
+      display: flex;
+      align-items: center;
+      gap: 15px;
+      opacity: 0;
+      width: 0;
+      overflow: hidden;
+      transition: all 0.3s ease;
+      white-space: nowrap;
+    }
+    
+    .ontowave-floating-menu.expanded .ontowave-menu-content {
+      opacity: 1;
+      width: auto;
+      overflow: visible;
+    }
+    
+    .ontowave-menu-brand {
+      font-weight: 600;
+      color: #0969da;
+      text-decoration: none;
+      cursor: pointer;
+      font-size: 0.9em;
+    }
+    
+    .ontowave-menu-brand:hover {
+      color: #0550ae;
+    }
+    
+    .org-suffix {
+      font-size: 0.7em;
+      opacity: 0.7;
+      font-weight: normal;
+    }
+    
+    .ontowave-menu-options {
+      display: flex;
+      gap: 8px;
+      flex-wrap: nowrap;
+    }
+    
+    .ontowave-menu-option {
+      padding: 6px 10px;
+      background: #f8f9fa;
+      border: 1px solid #d0d7de;
+      border-radius: 15px;
+      font-size: 0.75em;
+      cursor: pointer;
+      transition: all 0.2s ease;
+      white-space: nowrap;
+      pointer-events: auto;
+    }
+    
+    .ontowave-menu-option:hover {
+      background: #e2e8f0;
+      transform: translateY(-1px);
+    }
+    
+    .ontowave-menu-option.selected {
+      background: #0969da;
+      color: white;
+      border-color: #0969da;
+      box-shadow: 0 2px 8px rgba(9, 105, 218, 0.3);
+    }
+    
+    .ontowave-menu-option.selected:hover {
+      background: #0550ae;
+      border-color: #0550ae;
+      transform: translateY(-1px);
+    }
+    
+    /* Styles pour les boutons de langue */
+    .ontowave-lang-btn {
+      font-weight: bold;
+      font-size: 11px;
+    }
+    
+    .ontowave-lang-btn.active {
+      background: #28a745;
+      color: white;
+      border-color: #28a745;
+      box-shadow: 0 2px 8px rgba(40, 167, 69, 0.3);
+    }
+    
+    .ontowave-lang-btn.active:hover {
+      background: #1e7e34;
+      border-color: #1e7e34;
+    }
+    
+    /* Boutons de langue fixés - nouveaux styles */
+    .ontowave-fixed-lang-buttons {
+      position: fixed;
+      top: 20px;
+      right: 20px;
+      z-index: 999;
+      display: flex;
+      gap: 8px;
+      background: rgba(255, 255, 255, 0.95);
+      padding: 8px 12px;
+      border-radius: 25px;
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+      backdrop-filter: blur(10px);
+      border: 1px solid rgba(255, 255, 255, 0.2);
+    }
+    
+    /* Responsive : adaptation mobile */
+    @media (max-width: 768px) {
+      .ontowave-fixed-lang-buttons {
+        top: 10px;
+        right: 10px;
+        padding: 6px 8px;
+        gap: 4px;
+      }
+    }
+    
+    .ontowave-fixed-lang-btn {
+      background: linear-gradient(135deg, #6c757d 0%, #495057 100%);
+      color: white;
+      border: none;
+      padding: 6px 12px;
+      border-radius: 15px;
+      font-size: 12px;
+      font-weight: bold;
+      cursor: pointer;
+      transition: all 0.3s ease;
+      text-decoration: none;
+      display: flex;
+      align-items: center;
+      gap: 4px;
+      min-width: 40px;
+      justify-content: center;
+    }
+    
+    /* Responsive : boutons plus petits sur mobile */
+    @media (max-width: 768px) {
+      .ontowave-fixed-lang-btn {
+        padding: 4px 8px;
+        font-size: 11px;
+        min-width: 35px;
+        gap: 2px;
+      }
+    }
+    
+    .ontowave-fixed-lang-btn:hover {
+      background: linear-gradient(135deg, #5a6268 0%, #343a40 100%);
+      transform: translateY(-2px);
+      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+    }
+    
+    .ontowave-fixed-lang-btn.active {
+      background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
+      box-shadow: 0 4px 12px rgba(40, 167, 69, 0.4);
+    }
+    
+    .ontowave-fixed-lang-btn.active:hover {
+      background: linear-gradient(135deg, #1e7e34 0%, #198754 100%);
+      transform: translateY(-2px);
+    }
+    
+    /* Pas d'en-tête - supprimé */
+    .ontowave-header {
+      display: none;
+    }
+    
+    .ontowave-nav {
+      background: #f8f9fa;
+      border: 1px solid #e1e4e8;
+      border-radius: 8px;
+      padding: 1.5rem;
+      margin-bottom: 2rem;
+    }
+    
+    .ontowave-nav h3 {
+      margin: 0 0 1rem 0;
+      color: #24292e;
+      display: flex;
+      align-items: center;
+      gap: 0.5rem;
+    }
+    
+    .ontowave-nav-grid {
+      display: grid;
+      grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+      gap: 1rem;
+    }
+    
+    .ontowave-nav-item {
+      padding: 1rem;
+      background: white;
+      border: 1px solid #d0d7de;
+      border-radius: 6px;
+      text-decoration: none;
+      color: #24292e;
+      display: flex;
+      align-items: center;
+      gap: 0.5rem;
+      transition: all 0.2s ease;
+      font-weight: 500;
+      cursor: pointer;
+    }
+    
+    .ontowave-nav-item:hover {
+      background: #f3f4f6;
+      border-color: #0969da;
+      transform: translateY(-2px);
+      box-shadow: 0 4px 12px rgba(27,31,35,0.15);
+    }
+    
+    .ontowave-content {
+      background: white;
+      padding: 2rem;
+      border-radius: 8px;
+      box-shadow: 0 2px 8px rgba(27,31,35,0.15);
+      border: 1px solid #e1e4e8;
+      margin-bottom: 2rem;
+      min-height: 300px;
+      max-width: 1200px;
+      margin-left: auto;
+      margin-right: auto;
+    }
+    
+    /* Headers corrigés */
+    .ontowave-content h1 {
+      color: #24292e;
+      border-bottom: 2px solid #e1e4e8;
+      padding-bottom: 8px;
+      margin-bottom: 16px;
+      font-size: 2em;
+      font-weight: 600;
+    }
+    
+    .ontowave-content h2 {
+      color: #24292e;
+      margin-top: 24px;
+      margin-bottom: 16px;
+      font-size: 1.5em;
+      font-weight: 600;
+    }
+    
+    .ontowave-content h3 {
+      color: #24292e;
+      margin-top: 20px;
+      margin-bottom: 12px;
+      font-size: 1.25em;
+      font-weight: 600;
+    }
+    
+    .ontowave-content h4 {
+      color: #24292e;
+      margin-top: 16px;
+      margin-bottom: 10px;
+      font-size: 1.1em;
+      font-weight: 600;
+    }
+    
+    .ontowave-content h5 {
+      color: #24292e;
+      margin-top: 14px;
+      margin-bottom: 8px;
+      font-size: 1em;
+      font-weight: 600;
+    }
+    
+    .ontowave-content h6 {
+      color: #24292e;
+      margin-top: 12px;
+      margin-bottom: 6px;
+      font-size: 0.9em;
+      font-weight: 600;
+    }
+    
+    /* Séparateurs hr */
+    .ontowave-content hr {
+      border: none;
+      border-top: 1px solid #e1e4e8;
+      margin: 24px 0;
+    }
+    
+    /* Mermaid diagrams */
+    .ontowave-mermaid {
+      margin: 20px 0;
+      padding: 20px;
+      background: #f8f9fa;
+      border: 1px solid #e1e4e8;
+      border-radius: 8px;
+      text-align: center;
+    }
+    
+    .ontowave-loading {
+      text-align: center;
+      color: #666;
+      padding: 2rem;
+    }
+    
+    .ontowave-error {
+      color: #d73a49;
+      text-align: center;
+      padding: 2rem;
+      background: #ffeef0;
+      border: 1px solid #fdaeb7;
+      border-radius: 6px;
+    }
+    
+    .ontowave-mermaid {
+      background: #f6f8fa;
+      border: 1px solid #d0d7de;
+      border-radius: 6px;
+      padding: 1rem;
+      margin: 1rem 0;
+      text-align: center;
+    }
+    
+    .ontowave-plantuml {
+      background: #f6f8fa;
+      border: 1px solid #d0d7de;
+      border-radius: 6px;
+      padding: 1rem;
+      margin: 1rem 0;
+      text-align: center;
+    }
+    
+    .ontowave-plantuml img {
+      max-width: 100%;
+      height: auto;
+    }
+    
+    .ontowave-code {
+      background: #f6f8fa;
+      border: 1px solid #d0d7de;
+      border-radius: 6px;
+      padding: 1rem;
+      margin: 1rem 0;
+      overflow-x: auto;
+      font-family: ui-monospace, SFMono-Regular, monospace;
+    }
+    
+    .ontowave-breadcrumb {
+      padding: 0.5rem 0;
+      margin-bottom: 1rem;
+      border-bottom: 1px solid #e1e4e8;
+    }
+    
+    .ontowave-breadcrumb a {
+      color: #0969da;
+      text-decoration: none;
+      margin-right: 0.5rem;
+    }
+    
+    .ontowave-breadcrumb a:hover {
+      text-decoration: underline;
+    }
+    
+    .ontowave-breadcrumb span {
+      color: #656d76;
+      margin-right: 0.5rem;
+    }
+    
+    .ontowave-status {
+      background: #d4edda;
+      border: 1px solid #c3e6cb;
+      border-radius: 8px;
+      padding: 1rem;
+      margin-top: 2rem;
+    }
+    
+    .ontowave-status h4 {
+      margin: 0 0 0.5rem 0;
+      color: #155724;
+    }
+    
+    .ontowave-status ul {
+      margin: 0;
+      padding-left: 1.5rem;
+      color: #155724;
+    }
+    
+    @media (max-width: 768px) {
+      .ontowave-header {
+        padding: 1rem;
+      }
+      
+      .ontowave-header h1 {
+        font-size: 2em;
+      }
+      
+      .ontowave-nav-grid {
+        grid-template-columns: 1fr;
+      }
+      
+      .ontowave-content {
+        padding: 1rem;
+      }
+    }
+  `,document.head.appendChild(e)}async loadMermaid(){return new Promise(e=>{var t;d.mermaid?(this.mermaidLoaded=!0,this.initializeMermaid(),e()):((t=document.createElement("script")).src="https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.min.js",t.onload=()=>{this.mermaidLoaded=!0,this.initializeMermaid(),e()},t.onerror=()=>{console.warn("⚠️ Failed to load Mermaid library"),e()},document.head.appendChild(t))})}initializeMermaid(){d.mermaid&&(d.mermaid.initialize(this.config.mermaid),console.log("🎨 Mermaid initialized"))}async loadPrism(){return new Promise(n=>{if(d.Prism)return this.prismLoaded=!0,console.log("🎨 Prism already loaded"),n();var e=document.createElement("link"),e=(e.rel="stylesheet",e.href="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/themes/prism.min.css",document.head.appendChild(e),document.createElement("script"));e.src="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/components/prism-core.min.js",e.onload=()=>{console.log("🎨 Prism core loaded");let e=["markup","css","javascript"],t=0,o=()=>{t++,console.log(`🔤 Essential language loaded: ${t}/`+e.length),t>=e.length&&(d.Prism.languages.markup&&(d.Prism.languages.html=d.Prism.languages.markup,console.log("🔤 HTML alias created from markup")),this.prismLoaded=!0,console.log("✅ Prism ready with essential languages"),n(),["python","java","bash","json","yaml","typescript"].forEach(e=>{var t=document.createElement("script");t.src=`https://cdn.jsdelivr.net/npm/prismjs@1.29.0/components/prism-${e}.min.js`,t.onload=()=>{console.log("🔤 Additional Prism language loaded: "+e)},t.onerror=()=>{console.warn("⚠️ Failed to load Prism language: "+e)},document.head.appendChild(t)}))};e.forEach(e=>{var t=document.createElement("script");t.src=`https://cdn.jsdelivr.net/npm/prismjs@1.29.0/components/prism-${e}.min.js`,t.onload=o,t.onerror=()=>{console.warn("⚠️ Failed to load essential Prism language: "+e),o()},document.head.appendChild(t)})},e.onerror=()=>{console.warn("⚠️ Failed to load Prism library"),n()},document.head.appendChild(e)})}createInterface(t=null){this.container=document.getElementById(this.config.containerId),this.container||(this.container=document.createElement("div"),this.container.id=this.config.containerId,document.body.appendChild(this.container)),this.container.className="ontowave-container";var e=this.config.showGallery?`<span class="ontowave-menu-option" onclick="window.location.href='gallery.html'">🎨 ${this.t("menuGallery",t)}</span>`:"",o=this.config.ui?.languageButtons||"menu",o=this.config.locales&&1<this.config.locales.length&&("menu"===o||"both"===o)?this.config.locales.map(e=>`<span class="ontowave-menu-option ontowave-lang-btn${(t||this.getCurrentLanguage())===e?" active":""}" onclick="event.stopPropagation(); window.OntoWave.instance.switchLanguage('${e}');">🌐 ${e.toUpperCase()}</span>`).join(""):"";this.container.innerHTML=`
+        <div class="ontowave-floating-menu" id="ontowave-floating-menu" title="OntoWave Menu">
+          <span class="ontowave-menu-icon" id="ontowave-menu-icon">&#127754;</span>
+          <div class="ontowave-menu-content" id="ontowave-menu-content">
+            <a href="https://ontowave.org/" target="_blank" class="ontowave-menu-brand">OntoWave<span class="org-suffix">.org</span></a>
+            <div class="ontowave-menu-options">
+              <span class="ontowave-menu-option" onclick="window.OntoWave.instance.goHome()">🏠 ${this.t("menuHome",t)}</span>
+              ${e}
+              ${o}
+              <span class="ontowave-menu-option" onclick="event.stopPropagation(); window.OntoWave.instance.toggleConfigurationPanel(event, '${t||this.getCurrentLanguage()}');">⚙️ ${this.t("menuConfiguration",t)}</span>
+            </div>
+          </div>
+        </div>
+        
+        <div class="ontowave-content" id="ontowave-content">
+          <div class="ontowave-loading">⏳ Chargement du contenu...</div>
+        </div>
+        
+        <div class="ontowave-status" style="display: none;">
+          <h4>✅ OntoWave Package Actif</h4>
+          <ul>
+            <li><strong>Chargement rapide:</strong> Système intégré</li>
+            <li><strong>Mermaid:</strong> ${this.mermaidLoaded?"Chargé":"Non disponible"}</li>
+            <li><strong>Prism:</strong> ${this.prismLoaded?"Chargé":"Non disponible"}</li>
+            <li><strong>PlantUML:</strong> Support intégré</li>
+            <li><strong>Navigation:</strong> Hash préservé</li>
+          </ul>
+        </div>
+      `,this.createFixedLanguageButtons(t)}createFixedLanguageButtons(e=null){var t=document.getElementById("ontowave-fixed-lang-buttons"),t=(t&&t.remove(),this.config.ui?.languageButtons||"menu");if(this.config.locales&&1<this.config.locales.length&&("fixed"===t||"both"===t)){let n=e||this.getCurrentLanguage();var e=document.createElement("div"),o=(e.id="ontowave-fixed-lang-buttons",e.className="ontowave-fixed-lang-buttons",this.config.locales.map(e=>{var t=n===e?" active":"",o=this.getLanguageFlag(e);return`<button class="ontowave-fixed-lang-btn${t}" onclick="window.OntoWave.instance.switchLanguage('${e}')" title="Changer en ${e.toUpperCase()}">${o} ${e.toUpperCase()}</button>`}).join(""));e.innerHTML=o,document.body.appendChild(e),console.log("🌐 Boutons de langue fixés créés:",this.config.locales,"Mode:",t)}}getLanguageFlag(e){return{fr:"🇫🇷",en:"🇬🇧",es:"🇪🇸",de:"🇩🇪",it:"🇮🇹",pt:"🇵🇹",zh:"🇨🇳",ja:"🇯🇵",ko:"🇰🇷",ru:"🇷🇺"}[e]||"🌐"}initializeNavigation(){d.addEventListener("hashchange",()=>{var e=location.hash.replace("#","")||this.config.defaultPage;this.loadPage(e)}),this.createDefaultNavigation(),this.initializeFloatingMenu()}initializeFloatingMenu(){let l=document.getElementById("ontowave-floating-menu");var e=document.getElementById("ontowave-menu-icon");if(l&&e){let o=!1,i=!1,a={x:0,y:0};function t(){!o&&!document.querySelector(".ontowave-config-panel")?l.classList.remove("no-drag"):(l.classList.add("no-drag"),i=!1,document.body.style.userSelect="",document.body.style.cursor="")}function n(){i=!1,l.style.cursor="move",document.body.style.userSelect="",document.body.style.cursor=""}d.ontowaveUpdateDragState=t,e.addEventListener("click",e=>{e.stopPropagation(),(o=!o)?l.classList.add("expanded"):l.classList.remove("expanded"),t()}),document.addEventListener("click",e=>{!l.contains(e.target)&&o&&(o=!1,l.classList.remove("expanded"),t())}),l.addEventListener("mousedown",e=>{var t;o||document.querySelector(".ontowave-config-panel")||e.target.closest("a, .ontowave-menu-option")||(i=!0,t=l.getBoundingClientRect(),a.x=e.clientX-t.left,a.y=e.clientY-t.top,l.style.cursor="grabbing",document.body.style.userSelect="none",e.preventDefault(),e.stopPropagation())}),document.addEventListener("mousemove",e=>{var t,o,n;i&&(t=e.clientX-a.x,e=e.clientY-a.y,o=d.innerWidth-l.offsetWidth,n=d.innerHeight-l.offsetHeight,l.style.left=Math.max(0,Math.min(o,t))+"px",l.style.top=Math.max(0,Math.min(n,e))+"px")}),document.addEventListener("mouseup",()=>{i&&(i=!1,l.style.cursor="move",document.body.style.userSelect="")}),document.addEventListener("visibilitychange",n),d.addEventListener("blur",n),d.addEventListener("focus",n),d.resetOntoWaveDragState=n,l.addEventListener("touchstart",e=>{var t;e.target.closest("a, .ontowave-menu-option")||(e=e.touches[0],t=l.getBoundingClientRect(),a.x=e.clientX-t.left,a.y=e.clientY-t.top,i=!0)}),document.addEventListener("touchmove",e=>{var t,o,n;i&&(e.preventDefault(),t=(e=e.touches[0]).clientX-a.x,e=e.clientY-a.y,o=d.innerWidth-l.offsetWidth,n=d.innerHeight-l.offsetHeight,l.style.left=Math.max(0,Math.min(o,t))+"px",l.style.top=Math.max(0,Math.min(n,e))+"px")}),document.addEventListener("touchend",()=>{i=!1}),t(),this.enhanceMenuOptionClicks()}}enhanceMenuOptionClicks(){var e=document.querySelector('.ontowave-menu-option[onclick*="toggleConfigurationPanel"]');e&&e.addEventListener("click",e=>{e.preventDefault(),e.stopPropagation(),console.log("Configuration button clicked via event listener"),this.toggleConfigurationPanel(e)},{capture:!0})}createDefaultNavigation(){var e=document.getElementById("ontowave-nav-grid");e&&(e.innerHTML=[{href:"index.md",icon:"🏠",label:"Accueil"},{href:"en/index.md",icon:"🇬🇧",label:"English"},{href:"fr/index.md",icon:"🇫🇷",label:"Français"},{href:"demo/mermaid.md",icon:"🧜‍♀️",label:"Démo Mermaid"},{href:"demo/plantuml.md",icon:"🏭",label:"PlantUML"},{href:"demo/advanced-shapes.md",icon:"🎯",label:"Formes Avancées"}].map(e=>`
+        <a href="#${e.href}" class="ontowave-nav-item" onclick="window.OntoWave.loadPage('${e.href}')">
+          ${e.icon} ${e.label}
+        </a>
+      `).join(""))}async loadInitialPage(){var e=location.hash.replace("#","");if(this.isMultilingualMode()&&!e){var t=this.config.sources[this.config.defaultLocale];if(console.log("🌐 Multilingual mode detected"),console.log("🌐 Default locale:",this.config.defaultLocale),console.log("🌐 Default source:",t),console.log("🌐 Sources config:",this.config.sources),t)return console.log("🌐 Multilingual mode: redirecting to",t),void(location.hash="#"+t)}var o,t=e||this.config.defaultPage;if("index.md"===t){let e=!1;for(o of this.generatePageCandidates(t))try{if((await fetch(this.config.baseUrl+o,{method:"HEAD"})).ok){await this.loadPage(o),e=!0;break}}catch(e){continue}e||(console.log("📄 No index file found, showing configuration"),this.showConfigurationInterface())}else await this.loadPage(t)}async loadPage(t){var e=document.getElementById("ontowave-content");if(e){console.log("📄 Loading page:",t),this.currentPage=t,d.resetOntoWaveDragState&&d.resetOntoWaveDragState(),location.hash!=="#"+t&&(location.hash="#"+t),this.updateBreadcrumb(t),e.innerHTML='<div class="ontowave-loading">⏳ Chargement de '+t+"...</div>";try{var o=await fetch(this.config.baseUrl+t);if(!o.ok)throw new Error(`HTTP ${o.status}: `+o.statusText);var n=await o.text(),i=(console.log("✅ Content loaded:",n.length,"characters"),await this.renderMarkdown(n));e.innerHTML=i,await this.processDiagrams(e),await this.processPrism(e)}catch(e){console.error("❌ Failed to load page:",e),this.showError(`Impossible de charger ${t}: `+e.message)}}}updateBreadcrumb(e){var t=document.getElementById("ontowave-breadcrumb");if(t&&this.config.navigation.showBreadcrumb){let o=e.split("/"),n=['<a href="#'+this.config.defaultPage+'">🏠 Accueil</a>'],i="";o.forEach((e,t)=>{t===o.length-1?n.push("<span>"+e.replace(".md","")+"</span>"):(i+=(i?"/":"")+e,n.push('<a href="#'+i+'/index.md">'+e+"</a>"))}),t.innerHTML=n.join(" <span>›</span> "),t.style.display="block"}}async renderMarkdown(e){let o=e,l=[];return o=(o=o.replace(/```(\w+)([\s\S]*?)```/g,(e,t,o)=>{var n,i,o=o.trim(),a=`__CODE_BLOCK_${l.length}__`;return"mermaid"===t?(n="mermaid-"+Math.random().toString(36).substr(2,9),l.push(`<div class="ontowave-mermaid">
+            <div style="margin-bottom: 8px; font-weight: bold; color: #586069;">🧜‍♀️ Diagramme Mermaid</div>
+            <div class="mermaid" id="${n}">${o}</div>
+          </div>`)):"plantuml"===t?(n="plantuml-"+Math.random().toString(36).substr(2,9),i=(e=>{var t=(new TextEncoder).encode(e);let o="";for(let e=0;e<t.length;e++)o+=t[e].toString(16).padStart(2,"0");return"h"+o})(o),i=`${this.config.plantuml.server}/${this.config.plantuml.format}/~`+i,l.push(`<div class="ontowave-plantuml" id="${n}">
+            <div style="margin-bottom: 8px; font-weight: bold; color: #586069;">🏭 Diagramme PlantUML</div>
+            <img src="${i}" alt="Diagramme PlantUML" style="max-width: 100%; height: auto;" 
+                 onerror="this.parentElement.innerHTML='<div style=\\'color: #d73a49; padding: 20px;\\'>❌ Erreur de rendu PlantUML</div>'" />
+          </div>`)):(n=this.prismLoaded?"language-"+t:"",console.log(`📝 Processing code block: language="${t}", prismLoaded=${this.prismLoaded}, class="${n}"`),i=o.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;"),l.push(`<pre class="ontowave-code"><code class="${n}">${i}</code></pre>`)),a})).replace(/^###### (.+)$/gm,"<h6>$1</h6>").replace(/^##### (.+)$/gm,"<h5>$1</h5>").replace(/^#### (.+)$/gm,"<h4>$1</h4>").replace(/^### (.+)$/gm,"<h3>$1</h3>").replace(/^## (.+)$/gm,"<h2>$1</h2>").replace(/^# (.+)$/gm,"<h1>$1</h1>").replace(/^---+$/gm,"<hr>").replace(/!\[([^\]]*)\]\(([^)]+)\)/g,'<img src="$2" alt="$1">').replace(/\[([^\]]+)\]\(([^)]+\.html[^)]*)\)/g,'<a href="$2">$1</a>').replace(/\[([^\]]+)\]\((https?:\/\/[^)]+)\)/g,'<a href="$2" target="_blank">$1</a>').replace(/\[([^\]]+)\]\(([^)]+\.(tar\.gz|zip|pdf|doc|docx|xls|xlsx|ppt|pptx|txt|csv|json|xml|js|css|png|jpg|jpeg|gif|svg|webp)[^)]*)\)/g,'<a href="$2" download>$1</a>').replace(/\[([^\]]+)\]\(([^)]+)\)/g,'<a href="#$2" onclick="window.OntoWave.loadPage(\'$2\')">$1</a>').replace(/\*\*(.+?)\*\*/g,"<strong>$1</strong>").replace(/\*(.+?)\*/g,"<em>$1</em>").replace(/`([^`]+)`/g,"<code>$1</code>").split("\n\n").map(e=>e.trim()).filter(e=>0<e.length).map(e=>e.match(/^<(h[1-6]|hr|div|pre)/)?e:`<p>${e.replace(/\n/g,"<br>")}</p>`).join("\n"),l.forEach((e,t)=>{o=o.replace(`__CODE_BLOCK_${t}__`,e)}),o}async processDiagrams(t){if(this.mermaidLoaded&&d.mermaid){let o=t.querySelectorAll(".mermaid");if(0!==o.length){console.log("🎨 Processing",o.length,"Mermaid diagrams");try{o.forEach(e=>{e.removeAttribute("data-processed")}),await d.mermaid.run(),console.log("✅ Mermaid diagrams rendered successfully"),setTimeout(()=>{var e=t.querySelectorAll(".mermaid svg");console.log("🎨 SVG elements found:",e.length),0===e.length&&0<o.length&&(console.log("⚠️ Retrying Mermaid rendering..."),o.forEach(e=>{e.removeAttribute("data-processed")}),d.mermaid.init(void 0,o))},1e3)}catch(t){console.error("❌ Mermaid rendering error:",t),o.forEach(e=>{e.querySelector("svg")||(e.innerHTML=`<div style="color: #d73a49; padding: 10px;">❌ Erreur de rendu Mermaid: ${t.message}</div><pre style="background: #f8f8f8; padding: 10px; margin-top: 10px; border-radius: 4px;"><code>${e.textContent}</code></pre>`)})}}}}async processPrism(e){if(console.log("🔍 processPrism called - prismLoaded:",this.prismLoaded,"window.Prism:",!!d.Prism),d.Prism)try{console.log("🔤 Available Prism languages:",d.Prism.languages?Object.keys(d.Prism.languages):"none");var t=e.querySelectorAll('code[class*="language-"]'),o=(console.log("🎨 Found",t.length,"code blocks with language classes"),t.forEach((e,t)=>{console.log(`🔍 Code block ${t}:`),console.log(`  - class: "${e.className}"`),console.log("  - content length: "+e.textContent?.length),console.log(`  - content preview: "${e.textContent?.substring(0,50)}..."`),console.log("  - parent visible: "+("none"!==d.getComputedStyle(e.parentElement).display)),console.log("  - element visible: "+("none"!==d.getComputedStyle(e).display))}),e.querySelectorAll("code"));if(console.log("📝 Total code blocks found:",o.length),0<t.length){var n=t[0];console.log("🧪 Testing manual highlighting on first element...");var i=n.className.split(" ").find(e=>e.startsWith("language-")),a=i?i.replace("language-",""):"unknown";if(console.log(`🔤 Language detected: "${a}"`),console.log("🔤 Language available in Prism: "+!(!d.Prism.languages||!d.Prism.languages[a])),d.Prism.languages&&d.Prism.languages[a]){console.log("🧪 Attempting manual highlight...");var l=n.textContent;try{var r=d.Prism.highlight(l,d.Prism.languages[a],a);console.log("🎨 Manual highlight result length: "+r.length),console.log(`🎨 Manual highlight preview: "${r.substring(0,100)}..."`),n.innerHTML=r,console.log("✅ Manual highlight applied")}catch(e){console.error("❌ Manual highlight failed:",e)}}d.Prism.highlightAllUnder(e),console.log("✅ Prism syntax highlighting applied to",t.length,"blocks");var s=e.querySelectorAll(".token");console.log("🎨 Tokens created after highlighting:",s.length),0<s.length&&s.forEach((e,t)=>{console.log(`Token ${t}: "${e.textContent}" (class: ${e.className})`)})}else console.log("⚠️ No code blocks with language classes found for Prism")}catch(e){console.error("❌ Prism highlighting error:",e)}else console.log("🎨 Prism not available, skipping syntax highlighting")}showConfigurationInterface(){var e,t=document.getElementById("ontowave-content");t&&(e=JSON.stringify(this.config,null,2).replace(/"/g,"&quot;").replace(/</g,"&lt;").replace(/>/g,"&gt;"),t.innerHTML=`
+        <div class="ontowave-config-interface">
+          <div class="config-header">
+            <h1>🌊 OntoWave Configuration</h1>
+            <p>Aucun fichier index trouvé. Configurez OntoWave pour votre projet :</p>
+          </div>
+          
+          <div class="config-content">
+            <div class="config-form">
+              <h2>📝 Configuration</h2>
+              
+              <div class="form-group">
+                <label for="config-title">Titre du site :</label>
+                <input type="text" id="config-title" />
+              </div>
+              
+              <div class="form-group">
+                <label for="config-defaultPage">Page par défaut :</label>
+                <input type="text" id="config-defaultPage" />
+              </div>
+              
+              <div class="form-group">
+                <label for="config-locales">Langues supportées (séparées par des virgules) :</label>
+                <input type="text" id="config-locales" placeholder="fr-CA, fr, en" />
+              </div>
+              
+              <div class="form-group">
+                <label>
+                  <input type="checkbox" id="config-showGallery" />
+                  Afficher la galerie d'exemples
+                </label>
+              </div>
+              
+              <div class="form-group">
+                <label for="config-mermaidTheme">Thème Mermaid :</label>
+                <select id="config-mermaidTheme">
+                  <option value="default">Default</option>
+                  <option value="dark">Dark</option>
+                  <option value="forest">Forest</option>
+                  <option value="neutral">Neutral</option>
+                </select>
+              </div>
+              
+              <div class="form-actions">
+                <button onclick="window.OntoWave.instance.updateConfigFromForm()">✅ Appliquer</button>
+                <button onclick="window.OntoWave.instance.downloadConfig()">💾 Télécharger HTML</button>
+                <button onclick="window.OntoWave.instance.resetConfig()">🔄 Reset</button>
+              </div>
+            </div>
+            
+            <div class="config-code">
+              <h2>💻 Code HTML généré</h2>
+              <div class="code-preview">
+                <pre><code id="generated-html">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+    &lt;meta charset="UTF-8"&gt;
+    &lt;title&gt;${this.config.title}&lt;/title&gt;
+&lt;/head&gt;
+&lt;body&gt;
+    &lt;script src="ontowave.min.js"&gt;&lt;/script&gt;
+    &lt;script type="application/json" id="ontowave-config"&gt;
+${e}
+    &lt;/script&gt;
+&lt;/body&gt;
+&lt;/html&gt;</code></pre>
+              </div>
+              
+              <div class="usage-info">
+                <h3>📋 Instructions d'utilisation</h3>
+                <ol>
+                  <li>Configurez les options dans le formulaire</li>
+                  <li>Cliquez sur "Télécharger HTML" pour obtenir votre fichier</li>
+                  <li>Placez vos fichiers .md dans le même dossier</li>
+                  <li>Ouvrez le fichier HTML dans votre navigateur</li>
+                </ol>
+                
+                <h3>🌐 Gestion des langues</h3>
+                <ul>
+                  <li><strong>Monolingue :</strong> Laissez "Langues supportées" vide</li>
+                  <li><strong>Multilingue :</strong> Ajoutez les codes de langue (ex: fr, en, fr-CA)</li>
+                  <li><strong>Fichiers :</strong> index.fr.md, index.en.md, etc.</li>
+                  <li><strong>Fallback :</strong> index.md si aucune langue trouvée</li>
+                </ul>
+              </div>
+            </div>
+          </div>
+        </div>
+      `,this.addConfigStyles(),this.populateConfigForm(),this.updateGeneratedCode())}populateConfigForm(){var e=document.getElementById("config-title"),t=document.getElementById("config-defaultPage"),o=document.getElementById("config-locales"),n=document.getElementById("config-showGallery"),i=document.getElementById("config-mermaidTheme");e&&(e.value=this.config.title),t&&(t.value=this.config.defaultPage),o&&(o.value=this.config.locales.join(", ")),n&&(n.checked=this.config.showGallery),i&&(i.value=this.config.mermaid.theme)}addConfigStyles(){var e;document.getElementById("ontowave-config-styles")||((e=document.createElement("style")).id="ontowave-config-styles",e.textContent=`
+        .ontowave-config-interface {
+          max-width: 1200px;
+          margin: 0 auto;
+          padding: 20px;
+          font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+        }
+        
+        .config-header {
+          text-align: center;
+          margin-bottom: 40px;
+        }
+        
+        .config-header h1 {
+          color: #0969da;
+          margin-bottom: 10px;
+        }
+        
+        .config-content {
+          display: grid;
+          grid-template-columns: 1fr 1fr;
+          gap: 40px;
+          align-items: start;
+        }
+        
+        .config-form {
+          background: #f8f9fa;
+          padding: 30px;
+          border-radius: 12px;
+          border: 1px solid #e1e4e8;
+        }
+        
+        .config-code {
+          background: #ffffff;
+          padding: 30px;
+          border-radius: 12px;
+          border: 1px solid #e1e4e8;
+        }
+        
+        .form-group {
+          margin-bottom: 20px;
+        }
+        
+        .form-group label {
+          display: block;
+          font-weight: 600;
+          margin-bottom: 8px;
+          color: #24292e;
+        }
+        
+        .form-group input, .form-group select {
+          width: 100%;
+          padding: 10px;
+          border: 1px solid #d0d7de;
+          border-radius: 6px;
+          font-size: 14px;
+        }
+        
+        .form-group input[type="checkbox"] {
+          width: auto;
+          margin-right: 8px;
+        }
+        
+        .form-actions {
+          display: flex;
+          gap: 10px;
+          margin-top: 30px;
+        }
+        
+        .form-actions button {
+          flex: 1;
+          padding: 12px 20px;
+          border: none;
+          border-radius: 6px;
+          font-weight: 600;
+          cursor: pointer;
+          transition: all 0.2s ease;
+        }
+        
+        .form-actions button:first-child {
+          background: #28a745;
+          color: white;
+        }
+        
+        .form-actions button:nth-child(2) {
+          background: #0969da;
+          color: white;
+        }
+        
+        .form-actions button:last-child {
+          background: #6c757d;
+          color: white;
+        }
+        
+        .form-actions button:hover {
+          transform: translateY(-1px);
+          box-shadow: 0 4px 8px rgba(0,0,0,0.1);
+        }
+        
+        .code-preview {
+          background: #f6f8fa;
+          border: 1px solid #e1e4e8;
+          border-radius: 6px;
+          padding: 16px;
+          overflow-x: auto;
+          margin-bottom: 20px;
+        }
+        
+        .code-preview pre {
+          margin: 0;
+          font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
+          font-size: 13px;
+          line-height: 1.4;
+        }
+        
+        .usage-info h3 {
+          color: #0969da;
+          margin-top: 25px;
+          margin-bottom: 10px;
+        }
+        
+        .usage-info ul, .usage-info ol {
+          padding-left: 20px;
+        }
+        
+        .usage-info li {
+          margin-bottom: 5px;
+        }
+        
+        @media (max-width: 768px) {
+          .config-content {
+            grid-template-columns: 1fr;
+            gap: 20px;
+          }
+        }
+      `,document.head.appendChild(e))}updateConfigFromForm(){var e=document.getElementById("config-title").value,t=document.getElementById("config-defaultPage").value,o=document.getElementById("config-locales").value.split(",").map(e=>e.trim()).filter(e=>0<e.length),n=document.getElementById("config-showGallery").checked,i=document.getElementById("config-mermaidTheme").value;this.config.title=e,this.config.defaultPage=t,this.config.locales=o,this.config.showGallery=n,this.config.mermaid.theme=i,console.log("📝 Configuration updated:",this.config),document.title=this.config.title,this.updateGeneratedCode(),this.showNotification("✅ Configuration mise à jour")}updateGeneratedCode(){var e={title:this.config.title,baseUrl:this.config.baseUrl,defaultPage:this.config.defaultPage,locales:this.config.locales,fallbackLocale:this.config.fallbackLocale,showGallery:this.config.showGallery,mermaid:{theme:this.config.mermaid.theme}},e=JSON.stringify(e,null,2).replace(/"/g,"&quot;").replace(/</g,"&lt;").replace(/>/g,"&gt;"),e=`&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+    &lt;meta charset="UTF-8"&gt;
+    &lt;title&gt;${this.config.title}&lt;/title&gt;
+&lt;/head&gt;
+&lt;body&gt;
+    &lt;script src="ontowave.min.js"&gt;&lt;/script&gt;
+    &lt;script type="application/json" id="ontowave-config"&gt;
+${e}
+    &lt;/script&gt;
+&lt;/body&gt;
+&lt;/html&gt;`,t=document.getElementById("generated-html");t&&(t.innerHTML=e)}downloadConfig(){var e={title:this.config.title,baseUrl:this.config.baseUrl,defaultPage:this.config.defaultPage,locales:this.config.locales,fallbackLocale:this.config.fallbackLocale,showGallery:this.config.showGallery,mermaid:{theme:this.config.mermaid.theme}},e=JSON.stringify(e,null,2),e=`<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <title>${this.config.title}</title>
+</head>
+<body>
+    <script src="ontowave.min.js"></script>
+    <script type="application/json" id="ontowave-config">
+${e}
+    </script>
+</body>
+</html>`,e=new Blob([e],{type:"text/html"}),e=URL.createObjectURL(e),t=document.createElement("a");t.href=e,t.download="index.html",document.body.appendChild(t),t.click(),document.body.removeChild(t),URL.revokeObjectURL(e),this.showNotification("💾 Fichier HTML téléchargé")}resetConfig(){this.config={...t},this.showConfigurationInterface(),this.showNotification("🔄 Configuration réinitialisée")}showNotification(e){let t=document.createElement("div");t.style.cssText=`
+        position: fixed;
+        top: 20px;
+        right: 20px;
+        background: #28a745;
+        color: white;
+        padding: 12px 20px;
+        border-radius: 6px;
+        z-index: 10000;
+        font-weight: 600;
+        box-shadow: 0 4px 12px rgba(0,0,0,0.15);
+        animation: slideIn 0.3s ease;
+      `,t.textContent=e,document.getElementById("notification-styles")||((e=document.createElement("style")).id="notification-styles",e.textContent=`
+          @keyframes slideIn {
+            from { transform: translateX(100%); opacity: 0; }
+            to { transform: translateX(0); opacity: 1; }
+          }
+        `,document.head.appendChild(e)),document.body.appendChild(t),setTimeout(()=>{t.style.animation="slideIn 0.3s ease reverse",setTimeout(()=>{t.parentNode&&t.parentNode.removeChild(t)},300)},3e3)}showError(e){var t=document.getElementById("ontowave-content");t&&(t.innerHTML=`<div class="ontowave-error">❌ ${e}</div>`)}toggleConfigurationPanel(o,n=null){o&&(o.preventDefault(),o.stopPropagation());o=n||this.getCurrentLanguage(),console.log("⚙️ Opening config panel with locale:",o),n=document.querySelector(".ontowave-menu-content");if(n){var i=document.querySelector('.ontowave-menu-option[onclick*="toggleConfigurationPanel"]');let t=document.getElementById("ontowave-config-panel");if(t){t.remove(),i&&i.classList.remove("selected");let e=document.getElementById("ontowave-floating-menu");e&&e.classList.remove("has-config-panel"),"function"==typeof d.ontowaveUpdateDragState&&d.ontowaveUpdateDragState(),void console.log("Config panel closed")}else{i&&i.classList.add("selected"),(t=document.createElement("div")).id="ontowave-config-panel",t.className="ontowave-config-panel",t.innerHTML=`
+        <div class="config-panel-content">
+          <div class="config-full-panel">
+            <h3>🌊 ${this.t("configTitle",o)}</h3>
+            
+            <!-- Section Général -->
+            <div class="config-section">
+              <h4>📖 ${this.t("configGeneral",o)}</h4>
+              <div class="config-row">
+                <div class="form-group-full">
+                  <label for="config-title-full">${this.t("configSiteTitle",o)}</label>
+                  <input type="text" id="config-title-full" value="${this.config.title}" />
+                </div>
+                <div class="form-group-full">
+                  <label for="config-defaultPage-full">${this.t("configDefaultPage",o)}</label>
+                  <input type="text" id="config-defaultPage-full" value="${this.config.defaultPage}" placeholder="index.md" />
+                </div>
+              </div>
+              <div class="form-group-full">
+                <label for="config-baseUrl-full">${this.t("configBaseUrl",o)}</label>
+                <input type="text" id="config-baseUrl-full" value="${this.config.baseUrl}" placeholder="/" />
+              </div>
+            </div>
+
+            <!-- Section Langues et Localisation -->
+            <div class="config-section">
+              <h4>🌍 ${this.t("configLanguages",o)}</h4>
+              <div class="config-row">
+                <div class="form-group-full">
+                  <label for="config-locales-full">${this.t("configSupportedLanguages",o)}</label>
+                  <input type="text" id="config-locales-full" value="${this.config.locales.join(", ")}" placeholder="fr-CA, fr, en" />
+                  <small>${this.t("configLanguageNote",o)}</small>
+                </div>
+                <div class="form-group-full">
+                  <label for="config-fallbackLocale-full">${this.t("configFallbackLanguage",o)}</label>
+                  <select id="config-fallbackLocale-full">
+                    <option value="en" ${"en"===this.config.fallbackLocale?"selected":""}>English (en)</option>
+                    <option value="fr" ${"fr"===this.config.fallbackLocale?"selected":""}>Français (fr)</option>
+                    <option value="es" ${"es"===this.config.fallbackLocale?"selected":""}>Español (es)</option>
+                    <option value="de" ${"de"===this.config.fallbackLocale?"selected":""}>Deutsch (de)</option>
+                  </select>
+                </div>
+              </div>
+            </div>
+
+            <!-- Section Navigation et Interface -->
+            <div class="config-section">
+              <h4>🧭 ${this.t("configNavigation",o)}</h4>
+              <div class="config-row">
+                <div class="form-group-checkbox">
+                  <label>
+                    <input type="checkbox" id="config-showGallery-full" ${this.config.showGallery?"checked":""} />
+                    🎨 ${this.t("configShowGallery",o)}
+                  </label>
+                </div>
+                <div class="form-group-checkbox">
+                  <label>
+                    <input type="checkbox" id="config-navHome-full" ${!1!==this.config.navigation?.showHome?"checked":""} />
+                    🏠 ${this.t("configHomeButton",o)}
+                  </label>
+                </div>
+              </div>
+              <div class="config-row">
+                <div class="form-group-checkbox">
+                  <label>
+                    <input type="checkbox" id="config-navBreadcrumb-full" ${!1!==this.config.navigation?.showBreadcrumb?"checked":""} />
+                    📍 ${this.t("configBreadcrumb",o)}
+                  </label>
+                </div>
+                <div class="form-group-checkbox">
+                  <label>
+                    <input type="checkbox" id="config-navToc-full" ${!1!==this.config.navigation?.showToc?"checked":""} />
+                    📑 ${this.t("configToc",o)}
+                  </label>
+                </div>
+              </div>
+            </div>
+
+            <!-- Section Diagrammes Mermaid -->
+            <div class="config-section">
+              <h4>📊 ${this.t("configMermaid",o)}</h4>
+              <div class="config-row">
+                <div class="form-group-full">
+                  <label for="config-mermaidTheme-full">${this.t("configMermaidTheme",o)}</label>
+                  <select id="config-mermaidTheme-full">
+                    <option value="default" ${"default"===this.config.mermaid?.theme?"selected":""}>Default (clair)</option>
+                    <option value="dark" ${"dark"===this.config.mermaid?.theme?"selected":""}>Dark (sombre)</option>
+                    <option value="forest" ${"forest"===this.config.mermaid?.theme?"selected":""}>Forest (vert)</option>
+                    <option value="neutral" ${"neutral"===this.config.mermaid?.theme?"selected":""}>Neutral (neutre)</option>
+                  </select>
+                </div>
+                <div class="form-group-checkbox">
+                  <label>
+                    <input type="checkbox" id="config-mermaidStart-full" ${!1!==this.config.mermaid?.startOnLoad?"checked":""} />
+                    🚀 ${this.t("configMermaidAuto",o)}
+                  </label>
+                </div>
+              </div>
+              <div class="config-row">
+                <div class="form-group-checkbox">
+                  <label>
+                    <input type="checkbox" id="config-mermaidMaxWidth-full" ${!1!==this.config.mermaid?.flowchart?.useMaxWidth?"checked":""} />
+                    📐 ${this.t("configMermaidMaxWidth",o)}
+                  </label>
+                </div>
+              </div>
+            </div>
+
+            <!-- Section PlantUML -->
+            <div class="config-section">
+              <h4>🌿 ${this.t("configPlantuml",o)}</h4>
+              <div class="config-row">
+                <div class="form-group-full">
+                  <label for="config-plantumlServer-full">${this.t("configPlantumlServer",o)}</label>
+                  <input type="text" id="config-plantumlServer-full" value="${this.config.plantuml?.server||"https://www.plantuml.com/plantuml"}" />
+                </div>
+                <div class="form-group-full">
+                  <label for="config-plantumlFormat-full">${this.t("configPlantumlFormat",o)}</label>
+                  <select id="config-plantumlFormat-full">
+                    <option value="svg" ${"svg"===this.config.plantuml?.format?"selected":""}>SVG (vectoriel)</option>
+                    <option value="png" ${"png"===this.config.plantuml?.format?"selected":""}>PNG (bitmap)</option>
+                  </select>
+                </div>
+              </div>
+            </div>
+
+            <!-- Section Coloration Syntaxique -->
+            <div class="config-section">
+              <h4>🎨 ${this.t("configPrism",o)}</h4>
+              <div class="config-row">
+                <div class="form-group-full">
+                  <label for="config-prismTheme-full">${this.t("configPrismTheme",o)}</label>
+                  <select id="config-prismTheme-full">
+                    <option value="default" ${"default"===this.config.prism?.theme?"selected":""}>Default (clair)</option>
+                    <option value="dark" ${"dark"===this.config.prism?.theme?"selected":""}>Dark (sombre)</option>
+                    <option value="twilight" ${"twilight"===this.config.prism?.theme?"selected":""}>Twilight</option>
+                  </select>
+                </div>
+                <div class="form-group-checkbox">
+                  <label>
+                    <input type="checkbox" id="config-prismAutoload-full" ${!1!==this.config.prism?.autoload?"checked":""} />
+                    🔄 ${this.t("configPrismAutoload",o)}
+                  </label>
+                </div>
+              </div>
+            </div>
+
+            <!-- Section Interface Utilisateur -->
+            <div class="config-section">
+              <h4>💻 ${this.t("configUI",o)}</h4>
+              <div class="config-row">
+                <div class="form-group-full">
+                  <label for="config-uiTheme-full">${this.t("configUITheme",o)}</label>
+                  <select id="config-uiTheme-full">
+                    <option value="default" ${"default"===this.config.ui?.theme?"selected":""}>Default (clair)</option>
+                    <option value="dark" ${"dark"===this.config.ui?.theme?"selected":""}>Dark (sombre)</option>
+                    <option value="auto" ${"auto"===this.config.ui?.theme?"selected":""}>Auto (système)</option>
+                  </select>
+                </div>
+                <div class="form-group-checkbox">
+                  <label>
+                    <input type="checkbox" id="config-uiResponsive-full" ${!1!==this.config.ui?.responsive?"checked":""} />
+                    📱 ${this.t("configUIResponsive",o)}
+                  </label>
+                </div>
+              </div>
+              <div class="config-row">
+                <div class="form-group-checkbox">
+                  <label>
+                    <input type="checkbox" id="config-uiAnimations-full" ${!1!==this.config.ui?.animations?"checked":""} />
+                    ✨ ${this.t("configUIAnimations",o)}
+                  </label>
+                </div>
+              </div>
+            </div>
+
+            <!-- Actions -->
+            <div class="form-actions-full">
+              <button onclick="window.OntoWave.instance.updateConfigFromFullPanel()" class="btn-primary">✅ ${this.t("configApply",o)}</button>
+              <button onclick="window.OntoWave.instance.downloadConfigFromPanel()" class="btn-secondary">💾 ${this.t("configDownloadHTML",o)}</button>
+              <button onclick="window.OntoWave.instance.downloadOntoWaveScript()" class="btn-secondary">📥 ${this.t("configDownloadJS",o)}</button>
+              <button onclick="window.OntoWave.instance.resetConfigToDefaults()" class="btn-warning">🔄 ${this.t("configReset",o)}</button>
+            </div>
+          </div>
+        </div>
+      `,this.addConfigPanelStyles(),n.appendChild(t);let e=document.getElementById("ontowave-floating-menu");e&&e.classList.add("has-config-panel"),"function"==typeof d.ontowaveUpdateDragState&&d.ontowaveUpdateDragState(),this.updateGeneratedCodeMini(),console.log("Config panel opened")}}else console.error("Menu content not found")}updateConfigFromFullPanel(){var e=document.getElementById("config-title-full")?.value||this.config.title,t=document.getElementById("config-defaultPage-full")?.value||this.config.defaultPage,o=document.getElementById("config-baseUrl-full")?.value||this.config.baseUrl,n=document.getElementById("config-locales-full")?.value.split(",").map(e=>e.trim()).filter(e=>0<e.length)||this.config.locales,i=document.getElementById("config-fallbackLocale-full")?.value||this.config.fallbackLocale,a=document.getElementById("config-showGallery-full")?.checked||!1,l=!1!==document.getElementById("config-navHome-full")?.checked,r=!1!==document.getElementById("config-navBreadcrumb-full")?.checked,s=!1!==document.getElementById("config-navToc-full")?.checked,c=document.getElementById("config-mermaidTheme-full")?.value||"default",d=!1!==document.getElementById("config-mermaidStart-full")?.checked,g=!1!==document.getElementById("config-mermaidMaxWidth-full")?.checked,u=document.getElementById("config-plantumlServer-full")?.value||"https://www.plantuml.com/plantuml",m=document.getElementById("config-plantumlFormat-full")?.value||"svg",f=document.getElementById("config-prismTheme-full")?.value||"default",p=!1!==document.getElementById("config-prismAutoload-full")?.checked,h=document.getElementById("config-uiTheme-full")?.value||"default",v=!1!==document.getElementById("config-uiResponsive-full")?.checked,b=!1!==document.getElementById("config-uiAnimations-full")?.checked;this.config.title=e,this.config.defaultPage=t,this.config.baseUrl=o,this.config.locales=n,this.config.fallbackLocale=i,this.config.showGallery=a,this.config.navigation={showHome:l,showBreadcrumb:r,showToc:s},this.config.mermaid={theme:c,startOnLoad:d,flowchart:{useMaxWidth:g},sequence:{useMaxWidth:g},gantt:{useMaxWidth:g},journey:{useMaxWidth:g}},this.config.plantuml={server:u,format:m},this.config.prism={theme:f,autoload:p},this.config.ui={theme:h,responsive:v,animations:b},document.title=this.config.title,this.showNotification("Configuration appliquée avec succès ! 🎉"),console.log("Configuration mise à jour:",this.config)}resetConfigToDefaults(){var e;confirm("Voulez-vous vraiment réinitialiser toute la configuration aux valeurs par défaut ?")&&(Object.assign(this.config,{title:"OntoWave Documentation",baseUrl:"/",defaultPage:"index.md",locales:[],fallbackLocale:"en",showGallery:!1,mermaid:{theme:"default",startOnLoad:!0,flowchart:{useMaxWidth:!0},sequence:{useMaxWidth:!0},gantt:{useMaxWidth:!0},journey:{useMaxWidth:!0}},plantuml:{server:"https://www.plantuml.com/plantuml",format:"svg"},prism:{theme:"default",autoload:!0},navigation:{showHome:!0,showBreadcrumb:!0,showToc:!0},ui:{theme:"default",responsive:!0,animations:!0}}),(e=document.getElementById("ontowave-config-panel"))&&(e.remove(),"function"==typeof d.ontowaveUpdateDragState&&d.ontowaveUpdateDragState(),setTimeout(()=>this.toggleConfigurationPanel(),100)),this.showNotification("Configuration réinitialisée ! 🔄"))}updateConfigFromPanel(){var e=document.getElementById("config-title-mini")?.value||this.config.title,t=document.getElementById("config-locales-mini")?.value.split(",").map(e=>e.trim()).filter(e=>0<e.length)||this.config.locales,o=document.getElementById("config-showGallery-mini")?.checked||this.config.showGallery;this.config.title=e,this.config.locales=t,this.config.showGallery=o,document.title=this.config.title,this.updateGeneratedCodeMini(),this.showNotification("✅ Configuration mise à jour")}downloadConfigFromPanel(){var e={title:this.config.title,baseUrl:this.config.baseUrl,defaultPage:this.config.defaultPage,locales:this.config.locales,fallbackLocale:this.config.fallbackLocale,showGallery:this.config.showGallery,mermaid:{theme:this.config.mermaid.theme}},e=JSON.stringify(e,null,2),e=`<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <title>${this.config.title}</title>
+</head>
+<body>
+    <script src="ontowave.min.js"></script>
+    <script type="application/json" id="ontowave-config">
+${e}
+    </script>
+</body>
+</html>`,e=new Blob([e],{type:"text/html"}),e=URL.createObjectURL(e),t=document.createElement("a");t.href=e,t.download="index.html",document.body.appendChild(t),t.click(),document.body.removeChild(t),URL.revokeObjectURL(e),this.showNotification("💾 Fichier HTML téléchargé")}downloadOntoWaveScript(){var e=document.createElement("a");e.href="ontowave.min.js",e.download="ontowave.min.js",document.body.appendChild(e),e.click(),document.body.removeChild(e),this.showNotification("📥 Fichier ontowave.min.js téléchargé")}updateGeneratedCodeMini(){var e={title:this.config.title,baseUrl:this.config.baseUrl,defaultPage:this.config.defaultPage,locales:this.config.locales,fallbackLocale:this.config.fallbackLocale,showGallery:this.config.showGallery,mermaid:{theme:this.config.mermaid.theme}},e=JSON.stringify(e,null,2).replace(/"/g,"&quot;").replace(/</g,"&lt;").replace(/>/g,"&gt;"),e=`&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+    &lt;meta charset="UTF-8"&gt;
+    &lt;title&gt;${this.config.title}&lt;/title&gt;
+&lt;/head&gt;
+&lt;body&gt;
+    &lt;script src="ontowave.min.js"&gt;&lt;/script&gt;
+    &lt;script type="application/json" id="ontowave-config"&gt;
+${e}
+    &lt;/script&gt;
+&lt;/body&gt;
+&lt;/html&gt;`,t=document.getElementById("generated-html-mini");t&&(t.innerHTML=e)}addConfigPanelStyles(){var e;document.getElementById("ontowave-config-panel-styles")||((e=document.createElement("style")).id="ontowave-config-panel-styles",e.textContent=`
+        /* Panneau de configuration étendu */
+        .ontowave-config-panel {
+          position: absolute;
+          top: 100%;
+          left: 0;
+          right: 0;
+          background: white;
+          border: 1px solid #e1e4e8;
+          border-radius: 12px;
+          box-shadow: 0 16px 48px rgba(0,0,0,0.15);
+          z-index: 1001;
+          margin-top: 12px;
+          max-height: 90vh;
+          overflow-y: auto;
+          min-width: 90vw;
+          max-width: 95vw;
+          width: auto;
+        }
+        
+        .config-panel-content {
+          padding: 0;
+        }
+        
+        .config-full-panel {
+          padding: 32px;
+          max-width: none;
+        }
+        
+        .config-full-panel h3 {
+          margin: 0 0 32px 0;
+          color: #0969da;
+          font-size: 24px;
+          font-weight: 700;
+          text-align: center;
+          padding-bottom: 16px;
+          border-bottom: 2px solid #f6f8fa;
+        }
+        
+        /* Sections de configuration */
+        .config-section {
+          margin-bottom: 32px;
+          padding: 24px;
+          background: #f6f8fa;
+          border-radius: 8px;
+          border-left: 4px solid #0969da;
+        }
+        
+        .config-section h4 {
+          margin: 0 0 20px 0;
+          color: #24292e;
+          font-size: 18px;
+          font-weight: 600;
+          display: flex;
+          align-items: center;
+          gap: 8px;
+        }
+        
+        /* Disposition en lignes */
+        .config-row {
+          display: grid;
+          grid-template-columns: 1fr 1fr;
+          gap: 20px;
+          margin-bottom: 16px;
+        }
+        
+        .config-row:last-child {
+          margin-bottom: 0;
+        }
+        
+        /* Groupes de formulaire */
+        .form-group-full {
+          margin-bottom: 0;
+        }
+        
+        .form-group-full label {
+          display: block;
+          font-weight: 600;
+          margin-bottom: 8px;
+          color: #24292e;
+          font-size: 14px;
+        }
+        
+        .form-group-full input,
+        .form-group-full select {
+          width: 100%;
+          padding: 12px;
+          border: 2px solid #d0d7de;
+          border-radius: 6px;
+          font-size: 14px;
+          transition: border-color 0.2s ease;
+        }
+        
+        .form-group-full input:focus,
+        .form-group-full select:focus {
+          outline: none;
+          border-color: #0969da;
+          box-shadow: 0 0 0 3px rgba(9, 105, 218, 0.1);
+        }
+        
+        .form-group-full small {
+          display: block;
+          margin-top: 4px;
+          font-size: 12px;
+          color: #656d76;
+          font-style: italic;
+        }
+        
+        /* Checkboxes */
+        .form-group-checkbox {
+          display: flex;
+          align-items: center;
+          margin-bottom: 0;
+        }
+        
+        .form-group-checkbox label {
+          display: flex;
+          align-items: center;
+          font-weight: 500;
+          color: #24292e;
+          font-size: 14px;
+          cursor: pointer;
+          margin: 0;
+        }
+        
+        .form-group-checkbox input[type="checkbox"] {
+          width: auto;
+          margin: 0 8px 0 0;
+          transform: scale(1.2);
+          accent-color: #0969da;
+        }
+        
+        /* Actions du formulaire */
+        .form-actions-full {
+          display: flex;
+          gap: 16px;
+          justify-content: center;
+          margin-top: 40px;
+          padding-top: 24px;
+          border-top: 2px solid #f6f8fa;
+          flex-wrap: wrap;
+        }
+        
+        .form-actions-full button {
+          padding: 12px 24px;
+          border: none;
+          border-radius: 8px;
+          font-size: 14px;
+          font-weight: 600;
+          cursor: pointer;
+          transition: all 0.2s ease;
+          min-width: 180px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          gap: 8px;
+        }
+        
+        .btn-primary {
+          background: #0969da;
+          color: white;
+        }
+        
+        .btn-primary:hover {
+          background: #0550ae;
+          transform: translateY(-1px);
+          box-shadow: 0 4px 12px rgba(9, 105, 218, 0.3);
+        }
+        
+        .btn-secondary {
+          background: #6f7782;
+          color: white;
+        }
+        
+        .btn-secondary:hover {
+          background: #57606a;
+          transform: translateY(-1px);
+          box-shadow: 0 4px 12px rgba(111, 119, 130, 0.3);
+        }
+        
+        .btn-warning {
+          background: #d73a49;
+          color: white;
+        }
+        
+        .btn-warning:hover {
+          background: #b31d28;
+          transform: translateY(-1px);
+          box-shadow: 0 4px 12px rgba(215, 58, 73, 0.3);
+        }
+        
+        /* Responsive pour petits écrans */
+        @media (max-width: 768px) {
+          .ontowave-config-panel {
+            min-width: 95vw;
+            margin-top: 8px;
+          }
+          
+          .config-full-panel {
+            padding: 20px;
+          }
+          
+          .config-row {
+            grid-template-columns: 1fr;
+            gap: 16px;
+          }
+          
+          .form-actions-full {
+            flex-direction: column;
+            align-items: stretch;
+          }
+          
+          .form-actions-full button {
+            min-width: auto;
+          }
+        }
+        
+        /* Styles pour compatibilité avec l'ancien panneau compact */
+        .config-form-compact h3,
+        .config-preview-compact h3 {
+          margin: 0 0 16px 0;
+          color: #0969da;
+          font-size: 16px;
+          font-weight: 600;
+        }
+        
+        .form-group-compact {
+          margin-bottom: 16px;
+        }
+        
+        .form-group-compact label {
+          display: block;
+          font-weight: 600;
+          margin-bottom: 6px;
+          color: #24292e;
+          font-size: 13px;
+        }
+        
+        .form-group-compact input {
+          width: 100%;
+          padding: 8px;
+          border: 1px solid #d0d7de;
+          border-radius: 4px;
+          font-size: 13px;
+        }
+        
+        .form-group-compact input[type="checkbox"] {
+          width: auto;
+          margin-right: 6px;
+        }
+        
+        .form-actions-compact {
+          display: flex;
+          gap: 10px;
+          margin-top: 20px;
+          flex-wrap: wrap;
+        }
+        
+        .form-actions-compact button {
+          flex: 1;
+          padding: 10px 16px;
+          border: none;
+          border-radius: 6px;
+          background: #0969da;
+          color: white;
+          font-size: 13px;
+          font-weight: 600;
+          cursor: pointer;
+          transition: background 0.2s ease;
+          min-width: 120px;
+        }
+        
+        .form-actions-compact button:hover {
+          background: #0550ae;
+        }
+        
+        .config-preview-compact {
+          background: #f6f8fa;
+          border-radius: 6px;
+          padding: 16px;
+        }
+        
+        .code-preview-mini {
+          background: #24292e;
+          color: #f6f8fa;
+          padding: 12px;
+          border-radius: 4px;
+          font-family: 'SF Mono', Consolas, 'Liberation Mono', Menlo, monospace;
+          font-size: 11px;
+          line-height: 1.4;
+          overflow-x: auto;
+          max-height: 300px;
+          overflow-y: auto;
+        }
+      `,document.head.appendChild(e))}navigate(e){this.loadPage(e)}getConfig(){return{...this.config}}updateConfig(e){this.config={...this.config,...e},console.log("📝 Configuration updated")}}async function i(){try{var e,t=await fetch("./config.json");if(t.ok)return e=await t.json(),console.log("📁 Configuration chargée depuis config.json:",e),e}catch(e){console.log("📁 Pas de config.json trouvé, utilisation de la configuration par défaut")}return{}}document.addEventListener("DOMContentLoaded",async()=>{let e=d.OntoWaveConfig||{};e=d.OntoWaveConfig?{...await i(),...d.OntoWaveConfig}:await i(),d.OntoWave={instance:new n(e)},await d.OntoWave.instance.init(),console.log("🌊 OntoWave initialisé automatiquement")}),d.OntoWaveClass=n})(window);