@nuasite/cms 0.2.2 → 0.3.1

package/src/handlers/component-ops.ts

@@ -100,13 +100,10 @@ export async function handleInsertComponent(
 			} else {
 				const occurrenceIndex = getComponentOccurrenceIndex(manifest, referenceComponent)
 				refLineIndex = findComponentInvocationLine(lines, referenceComponent.componentName, occurrenceIndex)
-				if (refLineIndex < 0) {
-					refLineIndex = referenceComponent.sourceLine - 1
-				}
 			}
 
 			if (refLineIndex < 0 || refLineIndex >= lines.length) {
-				return { success: false, error: `Invalid source line for reference component: ${refLineIndex + 1}` }
+				return { success: false, error: `Could not find <${referenceComponent.componentName}> invocation in ${filePath}` }
 			}
 
 			const newComponentJsx = generateComponentJsx(componentName, props, componentDef)
@@ -126,6 +123,10 @@ export async function handleInsertComponent(
 				.join('\n')
 
 			lines.splice(insertIndex, 0, indentedJsx)
+
+			// Ensure the component is imported in the frontmatter
+			ensureComponentImport(lines, componentName, componentDef.file, filePath)
+
 			await fs.writeFile(fullPath, lines.join('\n'), 'utf-8')
 
 			return {
@@ -200,13 +201,10 @@ export async function handleRemoveComponent(
 			} else {
 				const occurrenceIndex = getComponentOccurrenceIndex(manifest, component)
 				refLineIndex = findComponentInvocationLine(lines, component.componentName, occurrenceIndex)
-				if (refLineIndex < 0) {
-					refLineIndex = component.sourceLine - 1
-				}
 			}
 
 			if (refLineIndex < 0 || refLineIndex >= lines.length) {
-				return { success: false, error: `Invalid source line for component: ${refLineIndex + 1}` }
+				return { success: false, error: `Could not find <${component.componentName}> invocation in ${filePath}` }
 			}
 
 			const { startLine, endLine } = findComponentBounds(
@@ -304,7 +302,7 @@ function findComponentBounds(
 	return { startLine, endLine }
 }
 
-function getPageFileCandidates(pageUrl: string): string[] {
+export function getPageFileCandidates(pageUrl: string): string[] {
 	let pathname: string
 	try {
 		const url = new URL(pageUrl)
@@ -330,7 +328,7 @@ function getPageFileCandidates(pageUrl: string): string[] {
 	]
 }
 
-function getComponentOccurrenceIndex(
+export function getComponentOccurrenceIndex(
 	manifest: CmsManifest,
 	referenceComponent: ComponentInstance,
 ): number {
@@ -343,14 +341,14 @@ function getComponentOccurrenceIndex(
 	const sameNameComponents = Object.values(manifest.components)
 		.filter(c =>
 			c.componentName === componentName
-			&& (!invocationSource || c.invocationSourcePath === invocationSource),
+			&& (!invocationSource || c.invocationSourcePath === invocationSource)
 		)
 
 	const index = sameNameComponents.findIndex(c => c.id === referenceComponent.id)
 	return index >= 0 ? index : 0
 }
 
-async function findComponentInvocationFile(
+export async function findComponentInvocationFile(
 	projectRoot: string,
 	pageUrl: string,
 	manifest: CmsManifest,
@@ -401,14 +399,16 @@ async function findComponentInvocationFile(
 	return null
 }
 
-function findComponentInvocationLine(
+export function findComponentInvocationLine(
 	lines: string[],
 	componentName: string,
 	occurrenceIndex: number,
 ): number {
-	const pattern = new RegExp(`<${escapeRegex(componentName)}(?:\\s|>|/>)`)
+	const pattern = new RegExp(`<${escapeRegex(componentName)}(?:\\s|>|/>|$)`)
+	// Skip frontmatter section in .astro/.mdx files (code between --- delimiters)
+	const startLine = findFrontmatterEnd(lines)
 	let found = 0
-	for (let i = 0; i < lines.length; i++) {
+	for (let i = startLine; i < lines.length; i++) {
 		if (pattern.test(lines[i]!)) {
 			if (found === occurrenceIndex) return i
 			found++
@@ -417,6 +417,18 @@ function findComponentInvocationLine(
 	return found > 0 ? findComponentInvocationLine(lines, componentName, 0) : -1
 }
 
+/**
+ * Find the line index after the frontmatter block (--- ... ---).
+ * Returns 0 if no frontmatter is found.
+ */
+export function findFrontmatterEnd(lines: string[]): number {
+	if (lines.length === 0 || lines[0]!.trim() !== '---') return 0
+	for (let i = 1; i < lines.length; i++) {
+		if (lines[i]!.trim() === '---') return i + 1
+	}
+	return 0
+}
+
 function generateComponentJsx(
 	componentName: string,
 	props: Record<string, unknown>,
@@ -452,12 +464,251 @@ function escapeHtml(str: string): string {
 		.replace(/>/g, '&gt;')
 }
 
-function getIndentation(line: string): string {
+export function getIndentation(line: string): string {
 	const match = line.match(/^(\s*)/)
 	return match ? match[1]! : ''
 }
 
-function normalizeFilePath(p: string): string {
-	return p.startsWith('/') ? p.slice(1) : p
+export function normalizeFilePath(p: string): string {
+	if (!p.startsWith('/')) return p
+	// Absolute filesystem paths (e.g. /Users/.../src/pages/index.astro) must stay intact
+	const projectRoot = path.resolve(getProjectRoot())
+	if (p.startsWith(projectRoot)) return p
+	// Project-relative paths with a leading slash (e.g. /src/pages/...) → strip it
+	return p.slice(1)
 }
 
+/**
+ * Extract prop values from a component invocation in source code.
+ * Parses the opening JSX tag starting at `lineIndex` and returns a map of prop names to values.
+ */
+export function extractPropsFromSource(
+	lines: string[],
+	lineIndex: number,
+	componentName: string,
+): Record<string, any> {
+	// Accumulate lines until we have the complete opening tag
+	let text = ''
+	for (let i = lineIndex; i < lines.length; i++) {
+		text += (i > lineIndex ? '\n' : '') + lines[i]!
+		if (findOpeningTagEnd(text) >= 0) break
+	}
+	return parseOpeningTagProps(text, componentName)
+}
+
+/**
+ * Find the position of `>` or `/>` that closes the opening tag,
+ * correctly skipping over braces and string literals.
+ * Returns -1 if the tag end is not found.
+ */
+function findOpeningTagEnd(text: string): number {
+	let braceDepth = 0
+	let inStr: string | null = null
+	let pastTagName = false
+
+	for (let i = 0; i < text.length; i++) {
+		const ch = text[i]!
+
+		if (!pastTagName) {
+			if (ch === '<') {
+				// Skip past `<ComponentName`
+				while (i < text.length && !/\s|\/|>/.test(text[i + 1] ?? '')) i++
+				pastTagName = true
+			}
+			continue
+		}
+
+		if (inStr) {
+			if (ch === '\\') {
+				i++
+				continue
+			}
+			if (ch === inStr) inStr = null
+			continue
+		}
+
+		if (ch === '"' || ch === "'" || ch === '`') {
+			inStr = ch
+			continue
+		}
+		if (ch === '{') {
+			braceDepth++
+			continue
+		}
+		if (ch === '}') {
+			braceDepth--
+			continue
+		}
+
+		if (braceDepth === 0) {
+			if (ch === '/' && text[i + 1] === '>') return i + 1
+			if (ch === '>') return i
+		}
+	}
+
+	return -1
+}
+
+/**
+ * Parse JSX props from an opening tag string like `<Comp foo="bar" count={3} active />`.
+ */
+function parseOpeningTagProps(text: string, componentName: string): Record<string, any> {
+	const props: Record<string, any> = {}
+
+	// Find <ComponentName and skip past it
+	const tagIdx = text.indexOf('<' + componentName)
+	if (tagIdx < 0) return props
+
+	let pos = tagIdx + 1 + componentName.length
+
+	while (pos < text.length) {
+		// Skip whitespace
+		while (pos < text.length && /\s/.test(text[pos]!)) pos++
+
+		// End of tag?
+		if (pos >= text.length || text[pos] === '>' || text[pos] === '/') break
+
+		// Spread: {...expr} — skip it
+		if (text[pos] === '{') {
+			pos = skipBracedBlock(text, pos)
+			continue
+		}
+
+		// Parse attribute name
+		const nameStart = pos
+		while (pos < text.length && /[\w\-:.]/.test(text[pos]!)) pos++
+		const name = text.slice(nameStart, pos)
+		if (!name) {
+			pos++
+			continue
+		}
+
+		// Skip whitespace
+		while (pos < text.length && /\s/.test(text[pos]!)) pos++
+
+		// No `=` means boolean shorthand
+		if (text[pos] !== '=') {
+			props[name] = true
+			continue
+		}
+		pos++ // skip =
+
+		// Skip whitespace
+		while (pos < text.length && /\s/.test(text[pos]!)) pos++
+
+		const ch = text[pos]
+		if (ch === '"' || ch === "'") {
+			// Quoted string: prop="value" or prop='value'
+			pos++
+			const start = pos
+			while (pos < text.length && text[pos] !== ch) {
+				if (text[pos] === '\\') pos++
+				pos++
+			}
+			props[name] = text.slice(start, pos)
+			pos++ // skip closing quote
+		} else if (ch === '{') {
+			// JSX expression: prop={...}
+			const inner = extractBracedContent(text, pos)
+			pos = skipBracedBlock(text, pos)
+
+			const trimmed = inner.trim()
+			if (trimmed === 'true') props[name] = true
+			else if (trimmed === 'false') props[name] = false
+			else if (/^-?\d+(\.\d+)?$/.test(trimmed)) props[name] = Number(trimmed)
+			else if (
+				(trimmed.startsWith('"') && trimmed.endsWith('"'))
+				|| (trimmed.startsWith("'") && trimmed.endsWith("'"))
+			) {
+				props[name] = trimmed.slice(1, -1)
+			} else if (trimmed.startsWith('`') && trimmed.endsWith('`')) {
+				props[name] = trimmed.slice(1, -1)
+			} else {
+				props[name] = trimmed // raw expression
+			}
+		}
+	}
+
+	return props
+}
+
+/** Skip past a balanced `{ ... }` block, handling nested braces and string literals. */
+function skipBracedBlock(text: string, pos: number): number {
+	let depth = 0
+	let inStr: string | null = null
+	while (pos < text.length) {
+		const ch = text[pos]!
+		if (inStr) {
+			if (ch === '\\') {
+				pos += 2
+				continue
+			}
+			if (ch === inStr) inStr = null
+		} else {
+			if (ch === '{') depth++
+			else if (ch === '}') {
+				depth--
+				if (depth === 0) return pos + 1
+			} else if (ch === '"' || ch === "'" || ch === '`') inStr = ch
+		}
+		pos++
+	}
+	return pos
+}
+
+/** Extract the text content between `{` and its matching `}`. */
+function extractBracedContent(text: string, pos: number): string {
+	const start = pos + 1
+	const end = skipBracedBlock(text, pos) - 1
+	return text.slice(start, end)
+}
+
+/**
+ * Ensure the component has an import statement in the file's frontmatter.
+ * If the component is already imported, this is a no-op.
+ * Mutates the `lines` array in place.
+ */
+export function ensureComponentImport(
+	lines: string[],
+	componentName: string,
+	componentFile: string,
+	targetFile: string,
+): void {
+	// Check if the component is already imported anywhere in the frontmatter
+	const importPattern = new RegExp(
+		`import\\s+${escapeRegex(componentName)}\\s+from\\s+['"]`,
+	)
+
+	const frontmatterEnd = findFrontmatterEnd(lines)
+
+	// Scan frontmatter for existing import
+	for (let i = 0; i < frontmatterEnd; i++) {
+		if (importPattern.test(lines[i]!)) {
+			return // Already imported
+		}
+	}
+
+	// Compute relative import path from target file to component file
+	const targetDir = path.dirname(targetFile)
+	let relativePath = path.relative(targetDir, componentFile)
+	if (!relativePath.startsWith('.')) {
+		relativePath = './' + relativePath
+	}
+
+	const importStatement = `import ${componentName} from '${relativePath}'`
+
+	if (frontmatterEnd > 0) {
+		// Has frontmatter — insert import before the closing ---
+		// Find the last import line or insert right after opening ---
+		let insertAt = 1 // After opening ---
+		for (let i = 1; i < frontmatterEnd - 1; i++) {
+			if (/^\s*import\s/.test(lines[i]!)) {
+				insertAt = i + 1
+			}
+		}
+		lines.splice(insertAt, 0, importStatement)
+	} else {
+		// No frontmatter — create one at the top
+		lines.splice(0, 0, '---', importStatement, '---')
+	}
+}

package/src/handlers/markdown-ops.ts

@@ -2,7 +2,7 @@ import fs from 'node:fs/promises'
 import path from 'node:path'
 import yaml from 'yaml'
 import { getProjectRoot } from '../config'
-import { acquireFileLock, resolveAndValidatePath as sharedResolveAndValidatePath } from '../utils'
+import { acquireFileLock } from '../utils'
 
 export interface BlogFrontmatter {
 	title: string
@@ -143,11 +143,14 @@ export async function handleCreateMarkdown(
  */
 function resolveAndValidatePath(filePath: string): string {
 	const projectRoot = getProjectRoot()
-	const normalizedPath = filePath.startsWith('/') ? filePath.slice(1) : filePath
-	const fullPath = path.resolve(projectRoot, normalizedPath)
+	const resolvedRoot = path.resolve(projectRoot)
+	// Absolute filesystem paths (e.g. /Users/...) stay intact;
+	// project-relative paths with a leading slash (e.g. /src/content/...) get it stripped
+	const isAbsoluteFs = filePath.startsWith(resolvedRoot)
+	const normalizedPath = (!isAbsoluteFs && filePath.startsWith('/')) ? filePath.slice(1) : filePath
+	const fullPath = path.isAbsolute(normalizedPath) ? path.resolve(normalizedPath) : path.resolve(projectRoot, normalizedPath)
 
 	// Ensure the resolved path is within the project root
-	const resolvedRoot = path.resolve(projectRoot)
 	if (!fullPath.startsWith(resolvedRoot + path.sep) && fullPath !== resolvedRoot) {
 		throw new Error(`Path traversal detected: ${filePath}`)
 	}

package/src/handlers/request-utils.ts

@@ -99,7 +99,7 @@ export function parseMultipartFile(body: Buffer, contentTypeHeader: string): Par
 
 		// Sanitize filename: strip path separators and dots prefix to prevent traversal
 		const rawFilename = dispositionMatch[1] ?? 'upload'
-		const filename = rawFilename.replace(/[/\\]/g, '_').replace(/^\.+/, '')  || 'upload'
+		const filename = rawFilename.replace(/[/\\]/g, '_').replace(/^\.+/, '') || 'upload'
 		const ctMatch = headerSection.match(/Content-Type:\s*(\S+)/)
 		const contentType = ctMatch?.[1] ?? 'application/octet-stream'
 

package/src/handlers/source-writer.ts

@@ -66,10 +66,10 @@ export async function handleUpdate(
 	const pageData = manifestWriter.getPageManifest(pagePath)
 	const manifest: CmsManifest = pageData
 		? {
-				entries: pageData.entries,
-				components: pageData.components,
-				componentDefinitions: manifestWriter.getComponentDefinitions(),
-			}
+			entries: pageData.entries,
+			components: pageData.components,
+			componentDefinitions: manifestWriter.getComponentDefinitions(),
+		}
 		: manifestWriter.getGlobalManifest()
 
 	// Group changes by source file
@@ -646,4 +646,3 @@ function findExpressionSrcAttribute(text: string): { index: number; length: numb
 function escapeRegExp(string: string): string {
 	return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
 }
-

package/src/index.ts

@@ -1,7 +1,7 @@
+import tailwindcss from '@tailwindcss/vite'
 import type { AstroIntegration } from 'astro'
 import { dirname, join } from 'node:path'
 import { fileURLToPath } from 'node:url'
-import tailwindcss from '@tailwindcss/vite'
 
 import { processBuildOutput } from './build-processor'
 import { scanCollections } from './collection-scanner'
@@ -142,7 +142,9 @@ export default function nuaCms(options: NuaCmsOptions = {}): AstroIntegration {
 						? `window.NuaCmsConfig = ${JSON.stringify(resolvedCmsConfig)};`
 						: ''
 
-					injectScript('page', `
+					injectScript(
+						'page',
+						`
 						${configScript}
 						if (!document.querySelector('script[data-nuasite-cms]')) {
 							const s = document.createElement('script');
@@ -151,7 +153,8 @@ export default function nuaCms(options: NuaCmsOptions = {}): AstroIntegration {
 							s.dataset.nuasiteCms = '';
 							document.head.appendChild(s);
 						}
-					`)
+					`,
+					)
 
 					// Resolve the virtual CMS editor path to the actual source file.
 					// Vite's dev server transforms the TSX, resolves imports, and serves it.
@@ -195,13 +198,15 @@ export default function nuaCms(options: NuaCmsOptions = {}): AstroIntegration {
 				updateConfig({
 					vite: {
 						plugins: vitePlugins,
-						resolve: !src ? {
-							alias: {
-								'react': 'preact/compat',
-								'react-dom': 'preact/compat',
-								'react/jsx-runtime': 'preact/jsx-runtime',
-							},
-						} : undefined,
+						resolve: !src
+							? {
+								alias: {
+									'react': 'preact/compat',
+									'react-dom': 'preact/compat',
+									'react/jsx-runtime': 'preact/jsx-runtime',
+								},
+							}
+							: undefined,
 						server: {
 							proxy: proxyConfig,
 						},

package/src/manifest-writer.ts

@@ -161,7 +161,7 @@ export class ManifestWriter {
 				this.writePageManifest(pagePath, entries, components, collection, seo)
 					.catch((err) => {
 						console.error(`[astro-cms] Failed to write manifest for ${pagePath}:`, err)
-					}),
+					})
 			)
 		}
 	}

package/src/source-finder/cross-file-tracker.ts

@@ -2,12 +2,12 @@ import fs from 'node:fs/promises'
 import path from 'node:path'
 
 import { getProjectRoot } from '../config'
+import { escapeRegex } from '../utils'
 import { buildDefinitionPath, parseExpressionPath } from './ast-extractors'
 import { getCachedParsedFile } from './ast-parser'
 import { findComponentProp, findExpressionProp, findSpreadProp } from './element-finder'
 import { normalizeText } from './snippet-utils'
 import type { ImportInfo, SourceLocation, VariableDefinition } from './types'
-import { escapeRegex } from '../utils'
 import { getExportedDefinitions, resolveImportPath } from './variable-extraction'
 
 // ============================================================================

package/src/source-finder/search-index.ts

@@ -3,6 +3,7 @@ import fs from 'node:fs/promises'
 import path from 'node:path'
 
 import { getProjectRoot } from '../config'
+import { escapeRegex } from '../utils'
 import { buildDefinitionPath, parseExpressionPath } from './ast-extractors'
 import { getCachedParsedFile } from './ast-parser'
 import {
@@ -14,7 +15,6 @@ import {
 	isSearchIndexInitialized,
 	setSearchIndexInitialized,
 } from './cache'
-import { escapeRegex } from '../utils'
 import { extractImageSnippet, extractInnerHtmlFromSnippet, normalizeText } from './snippet-utils'
 import type { CachedParsedFile, SourceLocation } from './types'