@nuasite/cms 0.5.0 → 0.5.1

package/package.json

@@ -14,7 +14,7 @@
     "directory": "packages/astro-cms"
   },
   "license": "Apache-2.0",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "module": "src/index.ts",
   "types": "src/index.ts",
   "type": "module",

package/src/editor/dom.ts

@@ -161,16 +161,19 @@ export function isStyledSpan(element: HTMLElement): boolean {
 }
 
 /**
- * Helper function to recursively extract plain text from child nodes,
- * replacing CMS elements with their placeholders.
- * Note: This returns plain text only - for styled content, use innerHTML directly.
+ * Block-level elements that browsers may create inside contentEditable on Enter.
+ * These are treated as line breaks when extracting text.
  */
+const BLOCK_ELEMENTS = new Set(['div', 'p', 'section', 'article', 'header', 'footer', 'blockquote'])
+
 function extractTextFromChildNodes(parentNode: HTMLElement): string {
 	let text = ''
 
 	parentNode.childNodes.forEach(node => {
 		if (node.nodeType === Node.TEXT_NODE) {
-			text += node.nodeValue || ''
+			// Normalize non-breaking spaces (\u00a0) that browsers insert in
+			// contentEditable to regular spaces
+			text += (node.nodeValue || '').replace(/\u00a0/g, ' ')
 		} else if (node.nodeType === Node.ELEMENT_NODE) {
 			const element = node as HTMLElement
 			const tagName = element.tagName.toLowerCase()
@@ -186,9 +189,17 @@ function extractTextFromChildNodes(parentNode: HTMLElement): string {
 			if (directCmsId) {
 				// Element has CMS ID - replace with placeholder
 				text += `{{cms:${directCmsId}}}`
+			} else if (BLOCK_ELEMENTS.has(tagName)) {
+				// Block-level elements created by browser on Enter should be
+				// treated as line breaks, not collapsed into the text
+				const blockText = extractTextFromChildNodes(element)
+				if (blockText) {
+					// Only add <br> separator if there's already text before this block
+					text += (text ? '<br>' : '') + blockText
+				}
 			} else {
 				// For all other elements (including styled spans), just get their text content
-				text += element.textContent || ''
+				text += (element.textContent || '').replace(/\u00a0/g, ' ')
 			}
 		}
 	})

package/src/editor/editor.ts

@@ -154,10 +154,28 @@ export async function startEditMode(
 		makeElementEditable(el)
 
 		// Suppress browser native contentEditable undo/redo (we handle it ourselves)
+		// Also convert Enter (insertParagraph) to <br> instead of the browser's
+		// default behavior which creates <div> elements with &nbsp; characters
 		el.addEventListener('beforeinput', (e) => {
 			if (e.inputType === 'historyUndo' || e.inputType === 'historyRedo') {
 				e.preventDefault()
 			}
+			if (e.inputType === 'insertParagraph') {
+				e.preventDefault()
+				const selection = window.getSelection()
+				if (selection && selection.rangeCount > 0) {
+					const range = selection.getRangeAt(0)
+					range.deleteContents()
+					const br = document.createElement('br')
+					range.insertNode(br)
+					range.setStartAfter(br)
+					range.collapse(true)
+					selection.removeAllRanges()
+					selection.addRange(range)
+					// Trigger input event for change tracking
+					el.dispatchEvent(new Event('input', { bubbles: true }))
+				}
+			}
 		})
 
 		// Setup color tracking for elements with colorClasses in manifest

package/src/source-finder/snippet-utils.ts

@@ -6,7 +6,7 @@ import type { Attribute, ManifestEntry } from '../types'
 import { escapeRegex, generateSourceHash } from '../utils'
 import { buildDefinitionPath } from './ast-extractors'
 import { getCachedParsedFile } from './ast-parser'
-import { findAttributeSourceLocation } from './cross-file-tracker'
+import { findAttributeSourceLocation, searchForExpressionProp, searchForPropInParents } from './cross-file-tracker'
 import { findImageElementNearLine, findImageSourceLocation } from './image-finder'
 
 // ============================================================================
@@ -640,6 +640,67 @@ export async function enhanceManifestWithSourceSnippets(
 							sourceHash,
 						}] as const
 					}
+
+					// Cross-file search for prop-driven dynamic text
+					// When text comes from a prop (e.g., {title} where title = Astro.props.title),
+					// trace it to where the prop value is actually defined in a parent component
+					if (cached) {
+						// Extract expression variables from the snippet to find props
+						const exprPattern = /\{(\w+(?:\.\w+|\[\d+\])*)\}/g
+						let exprMatch: RegExpExecArray | null
+						while ((exprMatch = exprPattern.exec(sourceSnippet)) !== null) {
+							const exprPath = exprMatch[1]!
+							const baseVar = exprPath.match(/^(\w+)/)?.[1]
+							if (baseVar && cached.propAliases.has(baseVar)) {
+								const propName = cached.propAliases.get(baseVar)!
+								const componentFileName = path.basename(filePath)
+								const result = await searchForExpressionProp(
+									componentFileName, propName, exprPath, entry.text!,
+								)
+								if (result) {
+									const propSnippet = result.snippet ?? trimmedText
+									const propSourceHash = generateSourceHash(propSnippet)
+									return [id, {
+										...entry,
+										sourcePath: result.file,
+										sourceLine: result.line,
+										sourceSnippet: propSnippet,
+										variableName: result.variableName,
+										attributes,
+										colorClasses,
+										sourceHash: propSourceHash,
+									}] as const
+								}
+							}
+						}
+
+						// Search for quoted prop values in parent components
+						// (handles <Component title="literal text" />)
+						const srcDir = path.join(getProjectRoot(), 'src')
+						for (const searchDir of ['pages', 'components', 'layouts']) {
+							try {
+								const result = await searchForPropInParents(
+									path.join(srcDir, searchDir), trimmedText,
+								)
+								if (result) {
+									const parentSnippet = result.snippet ?? trimmedText
+									const propSourceHash = generateSourceHash(parentSnippet)
+									return [id, {
+										...entry,
+										sourcePath: result.file,
+										sourceLine: result.line,
+										sourceSnippet: parentSnippet,
+										variableName: result.variableName,
+										attributes,
+										colorClasses,
+										sourceHash: propSourceHash,
+									}] as const
+								}
+							} catch {
+								// Directory doesn't exist
+							}
+						}
+					}
 				}
 
 				// Original static content path