Merge branch 'kennethkutyn:main' into main

Author: kennethkutyn

app.js

@@ -68,6 +68,12 @@ const setupLastEdited = () => {
     };
 
     titleEl.addEventListener('input', handleTitleChange);
+    titleEl.addEventListener('keydown', (event) => {
+        if (event.key === 'Enter') {
+            event.preventDefault();
+            titleEl.blur();
+        }
+    });
     titleEl.addEventListener('blur', handleTitleChange);
 };
 

index.html

@@ -104,15 +104,8 @@
                 </button>
                 <button class="toolbar-btn ai-btn" id="ai-btn" aria-label="AI assist" title="AI assist">
                     <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
-                        <path d="M12 3v2"></path>
-                        <path d="M12 19v2"></path>
-                        <path d="M5.64 5.64l1.41 1.41"></path>
-                        <path d="M16.95 16.95l1.41 1.41"></path>
-                        <path d="M3 12h2"></path>
-                        <path d="M19 12h2"></path>
-                        <path d="M5.64 18.36l1.41-1.41"></path>
-                        <path d="M16.95 7.05l1.41-1.41"></path>
-                        <circle cx="12" cy="12" r="3"></circle>
+                        <path d="M12 3 13.4 7.2H18l-3.5 2.6 1.3 4.1L12 11.6 8.2 13.9 9.5 9.8 6 7.2h4.6Z"></path>
+                        <path d="M6.5 14.5 7.3 16.8H9.7L7.8 18.2l.7 2.3-2-1.4-2 1.4.7-2.3-1.9-1.4h2.4Z"></path>
                     </svg>
                     <span>AI</span>
                 </button>

js/nodes.js

@@ -116,24 +116,26 @@ export async function initExportButton() {
         trackExportButtonClick();
         try {
             const exportContainer = document.querySelector('.canvas-container');
-            if (!exportContainer) return;
+            const captureTarget = document.querySelector('.canvas');
+            if (!exportContainer || !captureTarget) return;
             await loadHtml2Canvas();
             exportBtn.disabled = true;
             exportBtn.setAttribute('aria-label', 'Exporting diagram');
             exportContainer.classList.add('is-exporting');
+            const scale = Math.max(window.devicePixelRatio || 1, 2);
             const options = {
                 backgroundColor: '#FFFFFF',
-                scale: Math.max(window.devicePixelRatio || 1, 2),
+                scale,
                 scrollX: 0,
                 scrollY: 0,
                 useCORS: true,
-                width: exportContainer.scrollWidth,
-                height: exportContainer.scrollHeight,
-                windowWidth: exportContainer.scrollWidth,
-                windowHeight: exportContainer.scrollHeight
+                width: captureTarget.scrollWidth,
+                height: captureTarget.scrollHeight,
+                windowWidth: captureTarget.scrollWidth,
+                windowHeight: captureTarget.scrollHeight
             };
 
-            const canvas = await window.html2canvas(exportContainer, options);
+            const canvas = await window.html2canvas(captureTarget, options);
             const blob = await new Promise(resolve => canvas.toBlob(resolve, 'image/png'));
             if (!blob) return;
             const clipboardItem = new ClipboardItem({ 'image/png': blob });

styles.css

@@ -453,6 +453,7 @@ body {
     outline: none;
     min-width: 0;
     flex: 1;
+    white-space: pre-wrap;
 }
 
 .diagram-title:focus {