@nuasite/cms-marker 0.0.47 → 0.0.52

package/package.json

@@ -14,13 +14,13 @@
     "directory": "packages/cms-marker"
   },
   "license": "Apache-2.0",
-  "version": "0.0.47",
+  "version": "0.0.52",
   "module": "src/index.ts",
   "types": "src/index.ts",
   "type": "module",
   "dependencies": {
     "@astrojs/compiler": "^2.13.0",
-    "astro": "^5.12.4",
+    "astro": "^5.16.6",
     "node-html-parser": "^6.1.13"
   },
   "devDependencies": {

package/src/astro-transform.ts

@@ -9,18 +9,18 @@ export interface AstroTransformOptions {
 }
 
 /**
- * Vite plugin that transforms .astro files to inject source location metadata
- * This runs during Astro's compilation phase and adds data-astro-source-file and
- * data-astro-source-line attributes to HTML elements in the template.
+ * Vite plugin that transforms .astro files to inject source location metadata.
  *
- * NOTE: Component marking is NOT done here because modifying component tags
- * in the raw .astro source breaks Astro's JSX-like parser. Component marking
- * is done at the HTML output level instead (in dev-middleware and build-processor).
+ * NOTE: This plugin is currently DISABLED because Astro's native compiler already
+ * injects `data-astro-source-file` and `data-astro-source-loc` attributes in dev mode.
+ * Our html-processor now recognizes both Astro's native attributes and our custom ones.
  *
- * IMPORTANT: This plugin should only run in dev mode. During build, modifying
- * .astro source files can cause Vite's build-import-analysis to fail with
- * parsing errors. In build mode, source locations are extracted from Astro's
- * compiler output in build-processor.ts instead.
+ * HISTORICAL CONTEXT: This plugin was created before we discovered Astro's native
+ * source tracking. It caused Vite's build-import-analysis to fail with parsing errors
+ * because modifying .astro source files confuses Vite's JavaScript parser.
+ *
+ * KEEPING FOR: Potential future use cases where custom source attribute injection
+ * might be needed, or for testing purposes.
  */
 export function createAstroTransformPlugin(options: AstroTransformOptions = {}): Plugin {
 	// Component marking is intentionally disabled at the transform level

package/src/build-processor.ts

@@ -4,7 +4,8 @@ import path from 'node:path'
 import { fileURLToPath } from 'node:url'
 import { processHtml } from './html-processor'
 import type { ManifestWriter } from './manifest-writer'
-import type { CmsMarkerOptions } from './types'
+import { findCollectionSource, findMarkdownSourceLocation, findSourceLocation, parseMarkdownContent } from './source-finder'
+import type { CmsMarkerOptions, CollectionEntry } from './types'
 
 // Concurrency limit for parallel processing
 const MAX_CONCURRENT = 10
@@ -47,6 +48,24 @@ async function processFile(
 	const pagePath = getPagePath(filePath, outDir)
 	const html = await fs.readFile(filePath, 'utf-8')
 
+	// First, try to detect if this page is from a content collection
+	// We need to know this BEFORE processing HTML to skip marking markdown-rendered elements
+	const collectionInfo = await findCollectionSource(pagePath, config.contentDir)
+	const isCollectionPage = !!collectionInfo
+
+	// Parse markdown content early if this is a collection page
+	// We need the body content to find the wrapper element during HTML processing
+	let mdContent: Awaited<ReturnType<typeof parseMarkdownContent>> | undefined
+	if (collectionInfo) {
+		mdContent = await parseMarkdownContent(collectionInfo)
+	}
+
+	// Get the first non-empty line of the markdown body for wrapper detection
+	const bodyFirstLine = mdContent?.body
+		?.split('\n')
+		.find((line) => line.trim().length > 0)
+		?.trim()
+
 	// Create ID generator - use atomic increment
 	const pageIdStart = idCounter.value
 	const idGenerator = () => `cms-${idCounter.value++}`
@@ -62,15 +81,69 @@ async function processFile(
 			generateManifest: config.generateManifest,
 			markComponents: config.markComponents,
 			componentDirs: config.componentDirs,
+			// Skip marking markdown-rendered content on collection pages
+			// The markdown body is treated as a single editable unit
+			skipMarkdownContent: isCollectionPage,
+			// Pass collection info for wrapper element marking
+			collectionInfo: collectionInfo
+				? { name: collectionInfo.name, slug: collectionInfo.slug, bodyFirstLine }
+				: undefined,
 		},
 		idGenerator,
 	)
 
-	// Note: Source locations are now extracted from Astro's compiler attributes
-	// in html-processor.ts, so we don't need the expensive findSourceLocation calls
+	// During build, source location attributes are not injected by astro-transform.ts
+	// (disabled to avoid Vite parse errors). Use findSourceLocation to look up source files.
+
+	let collectionEntry: CollectionEntry | undefined
+
+	// Build collection entry if this is a collection page
+	if (collectionInfo && mdContent) {
+		collectionEntry = {
+			collectionName: mdContent.collectionName,
+			collectionSlug: mdContent.collectionSlug,
+			sourcePath: mdContent.file,
+			frontmatter: mdContent.frontmatter,
+			body: mdContent.body,
+			bodyStartLine: mdContent.bodyStartLine,
+			wrapperId: result.collectionWrapperId,
+		}
+	}
+
+	for (const entry of Object.values(result.entries)) {
+		// Skip entries that already have source info from component detection
+		if (entry.sourcePath && !entry.sourcePath.endsWith('.html')) {
+			continue
+		}
+
+		// Try to find source in collection markdown frontmatter first
+		if (collectionInfo) {
+			const mdSource = await findMarkdownSourceLocation(entry.text, collectionInfo)
+			if (mdSource) {
+				entry.sourcePath = mdSource.file
+				entry.sourceLine = mdSource.line
+				entry.sourceSnippet = mdSource.snippet
+				entry.sourceType = mdSource.type
+				entry.variableName = mdSource.variableName
+				entry.collectionName = mdSource.collectionName
+				entry.collectionSlug = mdSource.collectionSlug
+				continue
+			}
+		}
+
+		// Fall back to searching Astro files
+		const sourceLocation = await findSourceLocation(entry.text, entry.tag)
+		if (sourceLocation) {
+			entry.sourcePath = sourceLocation.file
+			entry.sourceLine = sourceLocation.line
+			entry.sourceSnippet = sourceLocation.snippet
+			entry.sourceType = sourceLocation.type
+			entry.variableName = sourceLocation.variableName
+		}
+	}
 
 	// Add to manifest writer (handles per-page manifest writes)
-	manifestWriter.addPage(pagePath, result.entries, result.components)
+	manifestWriter.addPage(pagePath, result.entries, result.components, collectionEntry)
 
 	// Write transformed HTML back
 	await fs.writeFile(filePath, result.html, 'utf-8')

package/src/component-registry.ts

@@ -94,7 +94,7 @@ export class ComponentRegistry {
 
 		while (i < content.length) {
 			// Skip whitespace and newlines
-			while (i < content.length && /\s/.test(content[i])) i++
+			while (i < content.length && /\s/.test(content[i] ?? '')) i++
 			if (i >= content.length) break
 
 			// Skip comments
@@ -113,27 +113,27 @@ export class ComponentRegistry {
 
 			// Extract property name
 			const nameStart = i
-			while (i < content.length && /\w/.test(content[i])) i++
+			while (i < content.length && /\w/.test(content[i] ?? '')) i++
 			const name = content.substring(nameStart, i)
 
 			if (!name) break
 
 			// Skip whitespace
-			while (i < content.length && /\s/.test(content[i])) i++
+			while (i < content.length && /\s/.test(content[i] ?? '')) i++
 
 			// Check for optional marker
 			const optional = content[i] === '?'
 			if (optional) i++
 
 			// Skip whitespace
-			while (i < content.length && /\s/.test(content[i])) i++
+			while (i < content.length && /\s/.test(content[i] ?? '')) i++
 
 			// Expect colon
 			if (content[i] !== ':') break
 			i++
 
 			// Skip whitespace
-			while (i < content.length && /\s/.test(content[i])) i++
+			while (i < content.length && /\s/.test(content[i] ?? '')) i++
 
 			// Extract type (up to semicolon, handling nested braces)
 			const typeStart = i
@@ -154,7 +154,7 @@ export class ComponentRegistry {
 			if (content[i] === ';') i++
 
 			// Skip whitespace
-			while (i < content.length && /[ \t]/.test(content[i])) i++
+			while (i < content.length && /[ \t]/.test(content[i] ?? '')) i++
 
 			// Check for inline comment
 			let description: string | undefined
@@ -215,7 +215,7 @@ export class ComponentRegistry {
 
 		// Find the frontmatter section
 		const frontmatterMatch = content.match(/^---\n([\s\S]*?)\n---/)
-		if (!frontmatterMatch) return props
+		if (!frontmatterMatch?.[1]) return props
 
 		const frontmatter = frontmatterMatch[1]
 

package/src/dev-middleware.ts

@@ -1,7 +1,8 @@
 import type { ViteDevServer } from 'vite'
 import { processHtml } from './html-processor'
 import type { ManifestWriter } from './manifest-writer'
-import type { CmsMarkerOptions, ComponentDefinition } from './types'
+import { findCollectionSource, parseMarkdownContent } from './source-finder'
+import type { CollectionEntry, CmsMarkerOptions, ComponentDefinition } from './types'
 
 /**
  * Get the normalized page path from a URL
@@ -109,9 +110,9 @@ export function createDevMiddleware(
 
 				// Process HTML asynchronously
 				processHtmlForDev(html, pagePath, config, idCounter)
-					.then(({ html: transformed, entries, components }) => {
+					.then(({ html: transformed, entries, components, collection }) => {
 						// Store in manifest writer
-						manifestWriter.addPage(pagePath, entries, components)
+						manifestWriter.addPage(pagePath, entries, components, collection)
 
 						// Restore original methods and send transformed HTML
 						res.write = originalWrite
@@ -158,6 +159,22 @@ async function processHtmlForDev(
 	let pageCounter = 0
 	const idGenerator = () => `cms-${pageCounter++}`
 
+	// Check if this is a collection page (e.g., /services/example -> services collection, example slug)
+	const collectionInfo = await findCollectionSource(pagePath, config.contentDir)
+	const isCollectionPage = !!collectionInfo
+
+	// Parse markdown content if this is a collection page
+	let mdContent: Awaited<ReturnType<typeof parseMarkdownContent>> | undefined
+	if (collectionInfo) {
+		mdContent = await parseMarkdownContent(collectionInfo)
+	}
+
+	// Get the first non-empty line of the markdown body for wrapper detection
+	const bodyFirstLine = mdContent?.body
+		?.split('\n')
+		.find((line) => line.trim().length > 0)
+		?.trim()
+
 	const result = await processHtml(
 		html,
 		pagePath,
@@ -169,15 +186,37 @@ async function processHtmlForDev(
 			generateManifest: config.generateManifest,
 			markComponents: config.markComponents,
 			componentDirs: config.componentDirs,
+			// Skip marking markdown-rendered content on collection pages
+			// The markdown body is treated as a single editable unit
+			skipMarkdownContent: isCollectionPage,
+			// Pass collection info for wrapper element marking
+			collectionInfo: collectionInfo
+				? { name: collectionInfo.name, slug: collectionInfo.slug, bodyFirstLine }
+				: undefined,
 		},
 		idGenerator,
 	)
 
+	// Build collection entry if this is a collection page
+	let collectionEntry: CollectionEntry | undefined
+	if (collectionInfo && mdContent) {
+		collectionEntry = {
+			collectionName: mdContent.collectionName,
+			collectionSlug: mdContent.collectionSlug,
+			sourcePath: mdContent.file,
+			frontmatter: mdContent.frontmatter,
+			body: mdContent.body,
+			bodyStartLine: mdContent.bodyStartLine,
+			wrapperId: result.collectionWrapperId,
+		}
+	}
+
 	// In dev mode, we use the source info from Astro compiler attributes
 	// which is already extracted by html-processor, so no need to call findSourceLocation
 	return {
 		html: result.html,
 		entries: result.entries,
 		components: result.components,
+		collection: collectionEntry,
 	}
 }

package/src/html-processor.ts

@@ -11,12 +11,23 @@ export interface ProcessHtmlOptions {
 	componentDirs?: string[]
 	excludeComponentDirs?: string[]
 	markStyledSpans?: boolean
+	/** When true, only mark elements that have source file attributes (from Astro templates) */
+	skipMarkdownContent?: boolean
+	/** Collection info for marking the wrapper element containing markdown content */
+	collectionInfo?: {
+		name: string
+		slug: string
+		/** First line of the markdown body (used to find wrapper element in build mode) */
+		bodyFirstLine?: string
+	}
 }
 
 export interface ProcessHtmlResult {
 	html: string
 	entries: Record<string, ManifestEntry>
 	components: Record<string, ComponentInstance>
+	/** ID of the element wrapping collection markdown content */
+	collectionWrapperId?: string
 }
 
 /**
@@ -116,6 +127,8 @@ export async function processHtml(
 		componentDirs = ['src/components'],
 		excludeComponentDirs = ['src/pages', 'src/layouts', 'src/layout'],
 		markStyledSpans = true,
+		skipMarkdownContent = false,
+		collectionInfo,
 	} = options
 
 	const root = parse(html, {
@@ -133,6 +146,7 @@ export async function processHtml(
 	const components: Record<string, ComponentInstance> = {}
 	const sourceLocationMap = new Map<string, { file: string; line: number }>()
 	const markedComponentRoots = new Set<any>()
+	let collectionWrapperId: string | undefined
 
 	// First pass: detect and mark component root elements
 	// A component root is detected by data-astro-source-file pointing to a component directory
@@ -187,7 +201,10 @@ export async function processHtml(
 			// Extract component name from file path (e.g., "src/components/Welcome.astro" -> "Welcome")
 			const componentName = extractComponentName(sourceFile)
 			// Parse source loc - format is "line:col" e.g. "20:21"
-			const sourceLocAttr = node.getAttribute('data-astro-source-line') || '1:0'
+			// Support both our custom attribute and Astro's native attribute
+			const sourceLocAttr = node.getAttribute('data-astro-source-loc')
+				|| node.getAttribute('data-astro-source-line')
+				|| '1:0'
 			const sourceLine = parseInt(sourceLocAttr.split(':')[0] ?? '1', 10)
 
 			components[id] = {
@@ -218,6 +235,112 @@ export async function processHtml(
 		})
 	}
 
+	// Collection wrapper detection pass: find the element that wraps markdown content
+	// Two strategies:
+	// 1. Dev mode: look for elements with data-astro-source-file containing children without it
+	// 2. Build mode: find element whose first child content matches the start of markdown body
+	if (collectionInfo) {
+		const allElements = root.querySelectorAll('*')
+		let foundWrapper = false
+
+		// Strategy 1: Dev mode - look for source file attributes
+		for (const node of allElements) {
+			const sourceFile = node.getAttribute('data-astro-source-file')
+			if (!sourceFile) continue
+
+			// Check if this element has any direct child elements without source file attribute
+			// These would be markdown-rendered elements
+			const childElements = node.childNodes.filter(
+				(child: any) => child.nodeType === 1 && child.tagName,
+			)
+			const hasMarkdownChildren = childElements.some(
+				(child: any) => !child.getAttribute?.('data-astro-source-file'),
+			)
+
+			if (hasMarkdownChildren) {
+				// Check if any ancestor already has been marked as a collection wrapper
+				// We want the innermost wrapper
+				let parent = node.parentNode
+				let hasAncestorWrapper = false
+				while (parent) {
+					if ((parent as any).getAttribute?.(attributeName)?.startsWith('cms-collection-')) {
+						hasAncestorWrapper = true
+						break
+					}
+					parent = parent.parentNode
+				}
+
+				if (!hasAncestorWrapper) {
+					// Mark this as the collection wrapper using the standard attribute
+					const id = getNextId()
+					node.setAttribute(attributeName, id)
+					collectionWrapperId = id
+					foundWrapper = true
+					// Don't break - we want the deepest wrapper, so we'll overwrite
+				}
+			}
+		}
+
+		// Strategy 2: Build mode - find element by matching markdown body content
+		if (!foundWrapper && collectionInfo.bodyFirstLine) {
+			// Normalize the first line of markdown body for comparison
+			// Strip markdown syntax to compare with rendered HTML text
+			const bodyStart = collectionInfo.bodyFirstLine
+				.replace(/^\*\*|\*\*$/g, '') // Remove markdown bold markers at start/end
+				.replace(/\*\*/g, '') // Remove any remaining markdown bold markers
+				.replace(/\*/g, '') // Remove markdown italic markers
+				.replace(/^#+ /, '') // Remove heading markers
+				.replace(/^\s*[-*+]\s+/, '') // Remove list markers
+				.replace(/\[([^\]]+)\]\([^)]+\)/g, '$1') // Extract link text
+				.trim()
+				.substring(0, 50) // Take first 50 chars for matching
+
+			if (bodyStart.length > 10) {
+				// Store all candidates that match the body start
+				const candidates: Array<{ node: any; blockChildCount: number }> = []
+
+				for (const node of allElements) {
+					const tag = node.tagName?.toLowerCase?.() ?? ''
+					// Skip script, style, etc.
+					if (['script', 'style', 'head', 'meta', 'link'].includes(tag)) continue
+
+					// Check if this element's first text content starts with the markdown body
+					const firstChild = node.childNodes.find(
+						(child: any) => child.nodeType === 1 && child.tagName,
+					) as any
+
+					if (firstChild) {
+						const firstChildText = (firstChild.innerText || '').trim().substring(0, 80)
+						if (firstChildText.includes(bodyStart)) {
+							// Count block-level child elements
+							// Markdown typically renders to multiple block elements (p, h2, h3, ul, ol, etc.)
+							const blockTags = ['p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'ul', 'ol', 'blockquote', 'pre', 'table', 'hr']
+							const blockChildCount = node.childNodes.filter(
+								(child: any) => child.nodeType === 1 && blockTags.includes(child.tagName?.toLowerCase?.()),
+							).length
+
+							candidates.push({ node, blockChildCount })
+						}
+					}
+				}
+
+				// Pick the candidate with the most block children (likely the markdown wrapper)
+				// Filter out already-marked elements
+				const unmarkedCandidates = candidates.filter(c => !c.node.getAttribute(attributeName))
+				if (unmarkedCandidates.length > 0) {
+					const best = unmarkedCandidates.reduce((a, b) => (b.blockChildCount > a.blockChildCount ? b : a))
+					if (best.blockChildCount >= 2) {
+						// Markdown body should have at least 2 block children
+						const id = getNextId()
+						best.node.setAttribute(attributeName, id)
+						collectionWrapperId = id
+						foundWrapper = true
+					}
+				}
+			}
+		}
+	}
+
 	// Third pass: assign IDs to all qualifying text elements and extract source locations
 	root.querySelectorAll('*').forEach((node) => {
 		const tag = node.tagName?.toLowerCase?.() ?? ''
@@ -229,12 +352,20 @@ export async function processHtml(
 		const textContent = (node.innerText ?? '').trim()
 		if (!includeEmptyText && !textContent) return
 
-		const id = getNextId()
-		node.setAttribute(attributeName, id)
-
 		// Extract source location from Astro compiler attributes
+		// Support both Astro's native attribute (data-astro-source-loc) and our custom one (data-astro-source-line)
 		const sourceFile = node.getAttribute('data-astro-source-file')
-		const sourceLine = node.getAttribute('data-astro-source-line')
+		const sourceLine = node.getAttribute('data-astro-source-loc')
+			|| node.getAttribute('data-astro-source-line')
+
+		// When skipMarkdownContent is true, only mark elements that have source file attributes
+		// (meaning they come from Astro templates, not rendered markdown content)
+		if (skipMarkdownContent && !sourceFile) {
+			return
+		}
+
+		const id = getNextId()
+		node.setAttribute(attributeName, id)
 
 		if (sourceFile && sourceLine) {
 			const lineNum = parseInt(sourceLine.split(':')[0] ?? '1', 10)
@@ -245,6 +376,7 @@ export async function processHtml(
 			// Component roots need these for identification
 			if (!markedComponentRoots.has(node)) {
 				node.removeAttribute('data-astro-source-file')
+				node.removeAttribute('data-astro-source-loc')
 				node.removeAttribute('data-astro-source-line')
 			}
 		}
@@ -291,8 +423,12 @@ export async function processHtml(
 			// Get direct text content (without placeholders)
 			const directText = textWithPlaceholders.replace(/\{\{cms:[^}]+\}\}/g, '').trim()
 
+			// Check if this is the collection wrapper
+			const isCollectionWrapper = id === collectionWrapperId
+
 			// Skip pure container elements (no direct text, only child CMS elements)
-			if (!directText && childCmsIds.length > 0) {
+			// BUT always include the collection wrapper
+			if (!directText && childCmsIds.length > 0 && !isCollectionWrapper) {
 				return
 			}
 
@@ -313,16 +449,18 @@ export async function processHtml(
 
 			entries[id] = {
 				id,
-				file: fileId,
 				tag,
 				text: textWithPlaceholders.trim(),
 				sourcePath: sourceLocation?.file || sourcePath,
 				childCmsIds: childCmsIds.length > 0 ? childCmsIds : undefined,
 				sourceLine: sourceLocation?.line,
 				sourceSnippet: undefined,
-				sourceType: undefined,
+				sourceType: isCollectionWrapper ? 'collection' : undefined,
 				variableName: undefined,
 				parentComponentId,
+				// Add collection info for the wrapper entry
+				collectionName: isCollectionWrapper ? collectionInfo?.name : undefined,
+				collectionSlug: isCollectionWrapper ? collectionInfo?.slug : undefined,
 			}
 		})
 	}
@@ -330,6 +468,7 @@ export async function processHtml(
 	// Clean up any remaining source attributes from component-marked elements
 	markedComponentRoots.forEach((node: any) => {
 		node.removeAttribute('data-astro-source-file')
+		node.removeAttribute('data-astro-source-loc')
 		node.removeAttribute('data-astro-source-line')
 	})
 
@@ -337,6 +476,7 @@ export async function processHtml(
 		html: root.toString(),
 		entries,
 		components,
+		collectionWrapperId,
 	}
 }
 

package/src/index.ts

@@ -16,6 +16,7 @@ export default function cmsMarker(options: CmsMarkerOptions = {}): AstroIntegrat
 		manifestFile = 'cms-manifest.json',
 		markComponents = true,
 		componentDirs = ['src/components'],
+		contentDir = 'src/content',
 	} = options
 
 	let componentDefinitions: Record<string, ComponentDefinition> = {}
@@ -35,6 +36,7 @@ export default function cmsMarker(options: CmsMarkerOptions = {}): AstroIntegrat
 		manifestFile,
 		markComponents,
 		componentDirs,
+		contentDir,
 	}
 
 	return {
@@ -89,4 +91,7 @@ export default function cmsMarker(options: CmsMarkerOptions = {}): AstroIntegrat
 }
 
 // Re-export types for consumers
-export type { CmsManifest, CmsMarkerOptions, ComponentDefinition, ComponentInstance, ManifestEntry } from './types'
+export { findCollectionSource, parseMarkdownContent } from './source-finder'
+export type { CollectionInfo, MarkdownContent } from './source-finder'
+export type { CmsManifest, CmsMarkerOptions, CollectionEntry, ComponentDefinition, ComponentInstance, ManifestEntry } from './types'
+

package/src/manifest-writer.ts

@@ -1,6 +1,6 @@
 import fs from 'node:fs/promises'
 import path from 'node:path'
-import type { CmsManifest, ComponentDefinition, ComponentInstance, ManifestEntry } from './types'
+import type { CmsManifest, CollectionEntry, ComponentDefinition, ComponentInstance, ManifestEntry } from './types'
 
 /**
  * Manages streaming manifest writes during build.
@@ -8,19 +8,24 @@ import type { CmsManifest, ComponentDefinition, ComponentInstance, ManifestEntry
  */
 export class ManifestWriter {
 	private globalManifest: CmsManifest
-	private pageManifests: Map<string, { entries: Record<string, ManifestEntry>; components: Record<string, ComponentInstance> }> = new Map()
+	private pageManifests: Map<string, {
+		entries: Record<string, ManifestEntry>
+		components: Record<string, ComponentInstance>
+		collection?: CollectionEntry
+	}> = new Map()
 	private outDir: string = ''
 	private manifestFile: string
 	private componentDefinitions: Record<string, ComponentDefinition>
 	private writeQueue: Promise<void> = Promise.resolve()
 
-	constructor(manifestFile: string = 'cms-manifest.json', componentDefinitions: Record<string, ComponentDefinition> = {}) {
+	constructor(manifestFile: string, componentDefinitions: Record<string, ComponentDefinition> = {}) {
 		this.manifestFile = manifestFile
 		this.componentDefinitions = componentDefinitions
 		this.globalManifest = {
 			entries: {},
 			components: {},
 			componentDefinitions,
+			collections: {},
 		}
 	}
 
@@ -59,17 +64,25 @@ export class ManifestWriter {
 		pagePath: string,
 		entries: Record<string, ManifestEntry>,
 		components: Record<string, ComponentInstance>,
+		collection?: CollectionEntry,
 	): void {
 		// Store in memory
-		this.pageManifests.set(pagePath, { entries, components })
+		this.pageManifests.set(pagePath, { entries, components, collection })
 
 		// Update global manifest
 		Object.assign(this.globalManifest.entries, entries)
 		Object.assign(this.globalManifest.components, components)
 
+		// Add collection entry to global manifest
+		if (collection) {
+			const collectionKey = `${collection.collectionName}/${collection.collectionSlug}`
+			this.globalManifest.collections = this.globalManifest.collections || {}
+			this.globalManifest.collections[collectionKey] = collection
+		}
+
 		// Queue the write operation (non-blocking)
 		if (this.outDir) {
-			this.writeQueue = this.writeQueue.then(() => this.writePageManifest(pagePath, entries, components))
+			this.writeQueue = this.writeQueue.then(() => this.writePageManifest(pagePath, entries, components, collection))
 		}
 	}
 
@@ -80,19 +93,30 @@ export class ManifestWriter {
 		pagePath: string,
 		entries: Record<string, ManifestEntry>,
 		components: Record<string, ComponentInstance>,
+		collection?: CollectionEntry,
 	): Promise<void> {
 		const manifestPath = this.getPageManifestPath(pagePath)
 		const manifestDir = path.dirname(manifestPath)
 
 		await fs.mkdir(manifestDir, { recursive: true })
 
-		const pageManifest = {
+		const pageManifest: {
+			page: string
+			entries: Record<string, ManifestEntry>
+			components: Record<string, ComponentInstance>
+			componentDefinitions: Record<string, ComponentDefinition>
+			collection?: CollectionEntry
+		} = {
 			page: pagePath,
 			entries,
 			components,
 			componentDefinitions: this.componentDefinitions,
 		}
 
+		if (collection) {
+			pageManifest.collection = collection
+		}
+
 		await fs.writeFile(manifestPath, JSON.stringify(pageManifest, null, 2), 'utf-8')
 	}
 
@@ -134,7 +158,11 @@ export class ManifestWriter {
 	/**
 	 * Get a page's manifest data (for dev mode)
 	 */
-	getPageManifest(pagePath: string): { entries: Record<string, ManifestEntry>; components: Record<string, ComponentInstance> } | undefined {
+	getPageManifest(pagePath: string): {
+		entries: Record<string, ManifestEntry>
+		components: Record<string, ComponentInstance>
+		collection?: CollectionEntry
+	} | undefined {
 		return this.pageManifests.get(pagePath)
 	}
 
@@ -147,6 +175,7 @@ export class ManifestWriter {
 			entries: {},
 			components: {},
 			componentDefinitions: this.componentDefinitions,
+			collections: {},
 		}
 		this.writeQueue = Promise.resolve()
 	}

package/src/source-finder.ts

@@ -5,9 +5,13 @@ export interface SourceLocation {
 	file: string
 	line: number
 	snippet?: string
-	type?: 'static' | 'variable' | 'prop' | 'computed'
+	type?: 'static' | 'variable' | 'prop' | 'computed' | 'collection'
 	variableName?: string
 	definitionLine?: number
+	/** Collection name for collection entries */
+	collectionName?: string
+	/** Entry slug for collection entries */
+	collectionSlug?: string
 }
 
 export interface VariableReference {
@@ -16,6 +20,27 @@ export interface VariableReference {
 	definitionLine: number
 }
 
+export interface CollectionInfo {
+	name: string
+	slug: string
+	file: string
+}
+
+export interface MarkdownContent {
+	/** Frontmatter fields as key-value pairs with line numbers */
+	frontmatter: Record<string, { value: string; line: number }>
+	/** The full markdown body content */
+	body: string
+	/** Line number where body starts */
+	bodyStartLine: number
+	/** File path relative to cwd */
+	file: string
+	/** Collection name */
+	collectionName: string
+	/** Collection slug */
+	collectionSlug: string
+}
+
 /**
  * Find source file and line number for text content
  */
@@ -46,7 +71,7 @@ export async function findSourceLocation(
 		// If not found directly, try searching for prop values in parent components
 		for (const dir of searchDirs) {
 			try {
-				const result = await searchForPropInParents(dir, textContent, tag)
+				const result = await searchForPropInParents(dir, textContent)
 				if (result) {
 					return result
 				}
@@ -102,7 +127,7 @@ async function searchAstroFile(
 		const content = await fs.readFile(filePath, 'utf-8')
 		const lines = content.split('\n')
 
-		const cleanText = cleanTextForSearch(textContent)
+		const cleanText = normalizeText(textContent)
 		const textPreview = cleanText.slice(0, Math.min(30, cleanText.length))
 
 		// Extract variable references from frontmatter
@@ -217,113 +242,103 @@ async function searchAstroFile(
 /**
  * Search for prop values passed to components
  */
-async function searchForPropInParents(
-	dir: string,
-	textContent: string,
-	tag: string,
-): Promise<SourceLocation | undefined> {
-	try {
-		const entries = await fs.readdir(dir, { withFileTypes: true })
-		const cleanText = cleanTextForSearch(textContent)
-
-		for (const entry of entries) {
-			const fullPath = path.join(dir, entry.name)
-
-			if (entry.isDirectory()) {
-				const result = await searchForPropInParents(fullPath, textContent, tag)
-				if (result) return result
-			} else if (entry.isFile() && entry.name.endsWith('.astro')) {
-				const content = await fs.readFile(fullPath, 'utf-8')
-				const lines = content.split('\n')
-
-				// Look for component tags with prop values matching our text
-				for (let i = 0; i < lines.length; i++) {
-					const line = lines[i]
-
-					// Match component usage like <ComponentName propName="value" />
-					const componentMatch = line?.match(/<([A-Z]\w+)/)
-					if (!componentMatch) continue
-
-					// Collect only the opening tag (until first > or />), not nested content
-					let openingTag = ''
-					let endLine = i
-					for (let j = i; j < Math.min(i + 10, lines.length); j++) {
-						openingTag += ' ' + lines[j]
-						endLine = j
-
-						// Stop at the end of opening tag (either /> or >)
-						if (lines[j]?.includes('/>')) {
-							// Self-closing tag
-							break
-						} else if (lines[j]?.includes('>')) {
-							// Opening tag ends here, don't include nested content
-							// Truncate to just the opening tag part
-							const tagEndIndex = openingTag.indexOf('>')
-							if (tagEndIndex !== -1) {
-								openingTag = openingTag.substring(0, tagEndIndex + 1)
-							}
-							break
+async function searchForPropInParents(dir: string, textContent: string): Promise<SourceLocation | undefined> {
+	const entries = await fs.readdir(dir, { withFileTypes: true })
+	const cleanText = normalizeText(textContent)
+
+	for (const entry of entries) {
+		const fullPath = path.join(dir, entry.name)
+
+		if (entry.isDirectory()) {
+			const result = await searchForPropInParents(fullPath, textContent)
+			if (result) return result
+		} else if (entry.isFile() && entry.name.endsWith('.astro')) {
+			const content = await fs.readFile(fullPath, 'utf-8')
+			const lines = content.split('\n')
+
+			// Look for component tags with prop values matching our text
+			for (let i = 0; i < lines.length; i++) {
+				const line = lines[i]
+
+				// Match component usage like <ComponentName propName="value" />
+				const componentMatch = line?.match(/<([A-Z]\w+)/)
+				if (!componentMatch) continue
+
+				// Collect only the opening tag (until first > or />), not nested content
+				let openingTag = ''
+				let endLine = i
+				for (let j = i; j < Math.min(i + 10, lines.length); j++) {
+					openingTag += ' ' + lines[j]
+					endLine = j
+
+					// Stop at the end of opening tag (either /> or >)
+					if (lines[j]?.includes('/>')) {
+						// Self-closing tag
+						break
+					} else if (lines[j]?.includes('>')) {
+						// Opening tag ends here, don't include nested content
+						// Truncate to just the opening tag part
+						const tagEndIndex = openingTag.indexOf('>')
+						if (tagEndIndex !== -1) {
+							openingTag = openingTag.substring(0, tagEndIndex + 1)
 						}
+						break
 					}
+				}
 
-					// Extract all prop values from the opening tag only
-					const propMatches = openingTag.matchAll(/(\w+)=["']([^"']+)["']/g)
-					for (const match of propMatches) {
-						const propName = match[1]
-						const propValue = match[2]
-
-						if (!propValue) {
-							continue
-						}
+				// Extract all prop values from the opening tag only
+				const propMatches = openingTag.matchAll(/(\w+)=["']([^"']+)["']/g)
+				for (const match of propMatches) {
+					const propName = match[1]
+					const propValue = match[2]
 
-						const normalizedValue = normalizeText(propValue)
+					if (!propValue) {
+						continue
+					}
 
-						if (normalizedValue === cleanText) {
-							// Find which line actually contains this prop
-							let propLine = i
-							let propLineIndex = i
+					const normalizedValue = normalizeText(propValue)
 
-							for (let k = i; k <= endLine; k++) {
-								const line = lines[k]
-								if (!line) {
-									continue
-								}
+					if (normalizedValue === cleanText) {
+						// Find which line actually contains this prop
+						let propLine = i
 
-								if (propName && line.includes(propName) && line.includes(propValue)) {
-									propLine = k
-									propLineIndex = k
-									break
-								}
+						for (let k = i; k <= endLine; k++) {
+							const line = lines[k]
+							if (!line) {
+								continue
 							}
 
-							// Extract complete component tag starting from where the component tag opens
-							const componentSnippetLines: string[] = []
-							for (let k = i; k <= endLine; k++) {
-								const line = lines[k]
-								if (!line) {
-									continue
-								}
+							if (propName && line.includes(propName) && line.includes(propValue)) {
+								propLine = k
+								break
+							}
+						}
 
-								componentSnippetLines.push(line)
+						// Extract complete component tag starting from where the component tag opens
+						const componentSnippetLines: string[] = []
+						for (let k = i; k <= endLine; k++) {
+							const line = lines[k]
+							if (!line) {
+								continue
 							}
 
-							const propSnippet = componentSnippetLines.join('\n')
+							componentSnippetLines.push(line)
+						}
 
-							// Found the prop being passed with our text value
-							return {
-								file: path.relative(process.cwd(), fullPath),
-								line: propLine + 1,
-								snippet: propSnippet,
-								type: 'prop',
-								variableName: propName,
-							}
+						const propSnippet = componentSnippetLines.join('\n')
+
+						// Found the prop being passed with our text value
+						return {
+							file: path.relative(process.cwd(), fullPath),
+							line: propLine + 1,
+							snippet: propSnippet,
+							type: 'prop',
+							variableName: propName,
 						}
 					}
 				}
 			}
 		}
-	} catch {
-		// Error reading directory
 	}
 
 	return undefined
@@ -468,8 +483,289 @@ function normalizeText(text: string): string {
 }
 
 /**
- * Clean text for search comparison
+ * Find markdown collection file for a given page path
+ * @param pagePath - The URL path of the page (e.g., '/services/3d-tisk')
+ * @param contentDir - The content directory (default: 'src/content')
+ * @returns Collection info if found, undefined otherwise
+ */
+export async function findCollectionSource(
+	pagePath: string,
+	contentDir: string = 'src/content',
+): Promise<CollectionInfo | undefined> {
+	// Remove leading/trailing slashes
+	const cleanPath = pagePath.replace(/^\/+|\/+$/g, '')
+	const pathParts = cleanPath.split('/')
+
+	if (pathParts.length < 2) {
+		// Need at least collection/slug
+		return undefined
+	}
+
+	const contentPath = path.join(process.cwd(), contentDir)
+
+	try {
+		// Check if content directory exists
+		await fs.access(contentPath)
+	} catch {
+		return undefined
+	}
+
+	// Try different collection/slug combinations
+	// Strategy 1: First segment is collection, rest is slug
+	// e.g., /services/3d-tisk -> collection: services, slug: 3d-tisk
+	const collectionName = pathParts[0]
+	const slug = pathParts.slice(1).join('/')
+
+	if (!collectionName || !slug) {
+		return undefined
+	}
+
+	const collectionPath = path.join(contentPath, collectionName)
+
+	try {
+		await fs.access(collectionPath)
+		const stat = await fs.stat(collectionPath)
+		if (!stat.isDirectory()) {
+			return undefined
+		}
+	} catch {
+		return undefined
+	}
+
+	// Look for markdown files matching the slug
+	const mdFile = await findMarkdownFile(collectionPath, slug)
+	if (mdFile) {
+		return {
+			name: collectionName,
+			slug,
+			file: path.relative(process.cwd(), mdFile),
+		}
+	}
+
+	return undefined
+}
+
+/**
+ * Find a markdown file in a collection directory by slug
+ */
+async function findMarkdownFile(collectionPath: string, slug: string): Promise<string | undefined> {
+	// Try direct match: slug.md or slug.mdx
+	const directPaths = [
+		path.join(collectionPath, `${slug}.md`),
+		path.join(collectionPath, `${slug}.mdx`),
+	]
+
+	for (const p of directPaths) {
+		try {
+			await fs.access(p)
+			return p
+		} catch {
+			// File doesn't exist, continue
+		}
+	}
+
+	// Try nested path for slugs with slashes
+	const slugParts = slug.split('/')
+	if (slugParts.length > 1) {
+		const nestedPath = path.join(collectionPath, ...slugParts.slice(0, -1))
+		const fileName = slugParts[slugParts.length - 1]
+		const nestedPaths = [
+			path.join(nestedPath, `${fileName}.md`),
+			path.join(nestedPath, `${fileName}.mdx`),
+		]
+		for (const p of nestedPaths) {
+			try {
+				await fs.access(p)
+				return p
+			} catch {
+				// File doesn't exist, continue
+			}
+		}
+	}
+
+	// Try index file in slug directory
+	const indexPaths = [
+		path.join(collectionPath, slug, 'index.md'),
+		path.join(collectionPath, slug, 'index.mdx'),
+	]
+
+	for (const p of indexPaths) {
+		try {
+			await fs.access(p)
+			return p
+		} catch {
+			// File doesn't exist, continue
+		}
+	}
+
+	return undefined
+}
+
+/**
+ * Find text content in a markdown file and return source location
+ * Only matches frontmatter fields, not body content (body is handled separately as a whole)
+ * @param textContent - The text content to search for
+ * @param collectionInfo - Collection information (name, slug, file path)
+ * @returns Source location if found in frontmatter
  */
-function cleanTextForSearch(text: string): string {
-	return normalizeText(text)
+export async function findMarkdownSourceLocation(
+	textContent: string,
+	collectionInfo: CollectionInfo,
+): Promise<SourceLocation | undefined> {
+	try {
+		const filePath = path.join(process.cwd(), collectionInfo.file)
+		const content = await fs.readFile(filePath, 'utf-8')
+		const lines = content.split('\n')
+		const normalizedSearch = normalizeText(textContent)
+
+		// Parse frontmatter
+		let frontmatterEnd = -1
+		let inFrontmatter = false
+
+		for (let i = 0; i < lines.length; i++) {
+			const line = lines[i]?.trim()
+			if (line === '---') {
+				if (!inFrontmatter) {
+					inFrontmatter = true
+				} else {
+					frontmatterEnd = i
+					break
+				}
+			}
+		}
+
+		// Search in frontmatter only (for title, subtitle, etc.)
+		if (frontmatterEnd > 0) {
+			for (let i = 1; i < frontmatterEnd; i++) {
+				const line = lines[i]
+				if (!line) continue
+
+				// Extract value from YAML key: value
+				const match = line.match(/^\s*(\w+):\s*(.+)$/)
+				if (match) {
+					const key = match[1]
+					let value = match[2]?.trim() || ''
+
+					// Handle quoted strings
+					if ((value.startsWith('"') && value.endsWith('"')) ||
+						(value.startsWith("'") && value.endsWith("'"))) {
+						value = value.slice(1, -1)
+					}
+
+					if (normalizeText(value) === normalizedSearch) {
+						return {
+							file: collectionInfo.file,
+							line: i + 1,
+							snippet: line,
+							type: 'collection',
+							variableName: key,
+							collectionName: collectionInfo.name,
+							collectionSlug: collectionInfo.slug,
+						}
+					}
+				}
+			}
+		}
+
+		// Body content is not searched line-by-line anymore
+		// Use parseMarkdownContent to get the full body as one entry
+	} catch {
+		// Error reading file
+	}
+
+	return undefined
 }
+
+/**
+ * Parse markdown file and extract frontmatter fields and full body content
+ * @param collectionInfo - Collection information (name, slug, file path)
+ * @returns Parsed markdown content with frontmatter and body
+ */
+export async function parseMarkdownContent(
+	collectionInfo: CollectionInfo,
+): Promise<MarkdownContent | undefined> {
+	try {
+		const filePath = path.join(process.cwd(), collectionInfo.file)
+		const content = await fs.readFile(filePath, 'utf-8')
+		const lines = content.split('\n')
+
+		// Parse frontmatter
+		let frontmatterStart = -1
+		let frontmatterEnd = -1
+
+		for (let i = 0; i < lines.length; i++) {
+			const line = lines[i]?.trim()
+			if (line === '---') {
+				if (frontmatterStart === -1) {
+					frontmatterStart = i
+				} else {
+					frontmatterEnd = i
+					break
+				}
+			}
+		}
+
+		const frontmatter: Record<string, { value: string; line: number }> = {}
+
+		// Extract frontmatter fields
+		if (frontmatterEnd > 0) {
+			for (let i = frontmatterStart + 1; i < frontmatterEnd; i++) {
+				const line = lines[i]
+				if (!line) continue
+
+				// Extract value from YAML key: value (simple single-line values only)
+				const match = line.match(/^\s*(\w+):\s*(.+)$/)
+				if (match) {
+					const key = match[1]
+					let value = match[2]?.trim() || ''
+
+					// Handle quoted strings
+					if ((value.startsWith('"') && value.endsWith('"')) ||
+						(value.startsWith("'") && value.endsWith("'"))) {
+						value = value.slice(1, -1)
+					}
+
+					if (key && value) {
+						frontmatter[key] = { value, line: i + 1 }
+					}
+				}
+			}
+		}
+
+		// Extract body (everything after frontmatter)
+		const bodyStartLine = frontmatterEnd > 0 ? frontmatterEnd + 1 : 0
+		const bodyLines = lines.slice(bodyStartLine)
+		const body = bodyLines.join('\n').trim()
+
+		return {
+			frontmatter,
+			body,
+			bodyStartLine: bodyStartLine + 1, // 1-indexed
+			file: collectionInfo.file,
+			collectionName: collectionInfo.name,
+			collectionSlug: collectionInfo.slug,
+		}
+	} catch {
+		// Error reading file
+	}
+
+	return undefined
+}
+
+/**
+ * Strip markdown syntax for text comparison
+ */
+function stripMarkdownSyntax(text: string): string {
+	return text
+		.replace(/^#+\s+/, '') // Headers
+		.replace(/\*\*([^*]+)\*\*/g, '$1') // Bold
+		.replace(/\*([^*]+)\*/g, '$1') // Italic
+		.replace(/__([^_]+)__/g, '$1') // Bold (underscore)
+		.replace(/_([^_]+)_/g, '$1') // Italic (underscore)
+		.replace(/`([^`]+)`/g, '$1') // Inline code
+		.replace(/\[([^\]]+)\]\([^)]+\)/g, '$1') // Links
+		.replace(/^\s*[-*+]\s+/, '') // List items
+		.replace(/^\s*\d+\.\s+/, '') // Numbered lists
+		.trim()
+}
+

package/src/types.ts

@@ -7,6 +7,8 @@ export interface CmsMarkerOptions {
 	manifestFile?: string
 	markComponents?: boolean
 	componentDirs?: string[]
+	/** Directory containing content collections (default: 'src/content') */
+	contentDir?: string
 }
 
 export interface ComponentProp {
@@ -27,16 +29,19 @@ export interface ComponentDefinition {
 
 export interface ManifestEntry {
 	id: string
-	file: string
 	tag: string
 	text: string
 	sourcePath?: string
 	sourceLine?: number
 	sourceSnippet?: string
-	sourceType?: 'static' | 'variable' | 'prop' | 'computed'
+	sourceType?: 'static' | 'variable' | 'prop' | 'computed' | 'collection'
 	variableName?: string
 	childCmsIds?: string[]
 	parentComponentId?: string
+	/** Collection name for collection entries (e.g., 'services', 'blog') */
+	collectionName?: string
+	/** Entry slug for collection entries (e.g., '3d-tisk') */
+	collectionSlug?: string
 }
 
 export interface ComponentInstance {
@@ -50,8 +55,28 @@ export interface ComponentInstance {
 	parentId?: string
 }
 
+/** Represents a content collection entry (markdown file) */
+export interface CollectionEntry {
+	/** Collection name (e.g., 'services', 'blog') */
+	collectionName: string
+	/** Entry slug (e.g., '3d-tisk') */
+	collectionSlug: string
+	/** Path to the markdown file relative to project root */
+	sourcePath: string
+	/** Frontmatter fields with their values and line numbers */
+	frontmatter: Record<string, { value: string; line: number }>
+	/** Full markdown body content */
+	body: string
+	/** Line number where body starts (1-indexed) */
+	bodyStartLine: number
+	/** ID of the wrapper element containing the rendered markdown */
+	wrapperId?: string
+}
+
 export interface CmsManifest {
 	entries: Record<string, ManifestEntry>
 	components: Record<string, ComponentInstance>
 	componentDefinitions: Record<string, ComponentDefinition>
+	/** Content collection entries indexed by "collectionName/slug" */
+	collections?: Record<string, CollectionEntry>
 }

package/src/vite-plugin.ts

@@ -1,7 +1,7 @@
 import type { Plugin } from 'vite'
+import { createAstroTransformPlugin } from './astro-transform'
 import type { ManifestWriter } from './manifest-writer'
 import type { CmsMarkerOptions, ComponentDefinition } from './types'
-import { createAstroTransformPlugin } from './astro-transform'
 
 export interface VitePluginContext {
 	manifestWriter: ManifestWriter
@@ -35,11 +35,12 @@ export function createVitePlugin(context: VitePluginContext): Plugin[] {
 	}
 
 	// Create the Astro transform plugin to inject source location attributes
-	// Only enabled in dev mode - during build, source locations are handled
-	// in build-processor.ts after HTML is generated
+	// NOTE: Disabled - Astro's native compiler already injects source location
+	// attributes (data-astro-source-file, data-astro-source-loc) in dev mode.
+	// Our html-processor recognizes these native attributes automatically.
 	const astroTransformPlugin = createAstroTransformPlugin({
 		markComponents: config.markComponents,
-		enabled: command === 'dev',
+		enabled: false, // Not needed - Astro provides source attributes natively
 	})
 
 	// Note: We cannot use transformIndexHtml for static Astro builds because