@farming-labs/theme 0.2.3 → 0.2.5

package/dist/ai-markdown.mjs

@@ -1,6 +1,7 @@
 import { highlight } from "sugar-high";
 
 //#region src/ai-markdown.ts
+const codeBlockTokenBoundary = String.fromCharCode(0);
 function buildCodeBlock(lang, code) {
 	const highlighted = highlight(code.replace(/\n$/, "")).replace(/<\/span>\n<span/g, "</span><span");
 	return `<div class="fd-ai-code-block"><div class="fd-ai-code-header">${lang ? `<div class="fd-ai-code-lang">${escapeHtml(lang)}</div>` : ""}<button class="fd-ai-code-copy" onclick="(function(btn){var code=btn.closest('.fd-ai-code-block').querySelector('code').textContent;navigator.clipboard.writeText(code).then(function(){btn.textContent='Copied!';setTimeout(function(){btn.textContent='Copy'},1500)})})(this)">Copy</button></div><pre><code>${highlighted}</code></pre></div>`;
@@ -51,13 +52,36 @@ function replaceFencedCodeBlocks(text, codeBlocks, tokenBoundary) {
 	return output.join("\n");
 }
 function renderAIResponseMarkdown(text) {
-	const codeBlockTokenBoundary = String.fromCharCode(0);
-	const codeBlockTokenPattern = new RegExp(`${codeBlockTokenBoundary}CB(\\d+)${codeBlockTokenBoundary}`, "g");
 	const codeBlocks = [];
-	const lines = replaceFencedCodeBlocks(text, codeBlocks, codeBlockTokenBoundary).split("\n");
+	return renderMarkdownBlocks(replaceFencedCodeBlocks(text, codeBlocks, codeBlockTokenBoundary), codeBlocks);
+}
+function renderMarkdownBlocks(text, codeBlocks) {
+	const lines = text.split("\n");
 	const output = [];
 	let i = 0;
 	while (i < lines.length) {
+		const trimmed = lines[i].trim();
+		if (!trimmed) {
+			i++;
+			continue;
+		}
+		const codeBlockIndex = getCodeBlockTokenIndex(trimmed);
+		if (codeBlockIndex !== null) {
+			output.push(codeBlocks[codeBlockIndex] ?? "");
+			i++;
+			continue;
+		}
+		if (isHorizontalRule(trimmed)) {
+			output.push("<hr class=\"fd-ai-hr\" />");
+			i++;
+			continue;
+		}
+		const heading = getHeading(trimmed);
+		if (heading) {
+			output.push(`<h${heading.level}>${renderInlineMarkdown(heading.text)}</h${heading.level}>`);
+			i++;
+			continue;
+		}
 		if (isTableRow(lines[i]) && i + 1 < lines.length && isTableSeparator(lines[i + 1])) {
 			const tableLines = [lines[i]];
 			i++;
@@ -69,17 +93,82 @@ function renderAIResponseMarkdown(text) {
 			output.push(renderTable(tableLines));
 			continue;
 		}
-		output.push(lines[i]);
+		const unorderedItems = collectListItems(lines, i, "unordered");
+		if (unorderedItems) {
+			output.push(`<ul>${unorderedItems.items.map((item) => `<li>${renderInlineMarkdown(item)}</li>`).join("")}</ul>`);
+			i = unorderedItems.nextIndex;
+			continue;
+		}
+		const orderedItems = collectListItems(lines, i, "ordered");
+		if (orderedItems) {
+			output.push(`<ol>${orderedItems.items.map((item) => `<li>${renderInlineMarkdown(item)}</li>`).join("")}</ol>`);
+			i = orderedItems.nextIndex;
+			continue;
+		}
+		const paragraphLines = [];
+		while (i < lines.length && lines[i].trim() && !isMarkdownBlockStart(lines, i)) {
+			paragraphLines.push(lines[i].trim());
+			i++;
+		}
+		output.push(`<p>${paragraphLines.map((paragraphLine) => renderInlineMarkdown(paragraphLine)).join("<br>")}</p>`);
+	}
+	return output.join("");
+}
+function getCodeBlockTokenIndex(line) {
+	const prefix = `${codeBlockTokenBoundary}CB`;
+	if (!line.startsWith(prefix) || !line.endsWith(codeBlockTokenBoundary)) return null;
+	const rawIndex = line.slice(prefix.length, -1);
+	if (!/^\d+$/.test(rawIndex)) return null;
+	return Number(rawIndex);
+}
+function getHeading(line) {
+	const match = /^(#{1,4})\s+(.+)$/.exec(line);
+	if (!match) return null;
+	return {
+		level: match[1].length + 1,
+		text: match[2]
+	};
+}
+function collectListItems(lines, startIndex, type) {
+	const pattern = type === "ordered" ? /^(?: {0,3})\d+\.\s+(.+)$/ : /^(?: {0,3})[-*+]\s+(.+)$/;
+	const items = [];
+	let i = startIndex;
+	while (i < lines.length) {
+		const match = pattern.exec(lines[i]);
+		if (!match) break;
+		items.push(match[1]);
 		i++;
 	}
-	let result = output.join("\n");
-	result = result.replace(/`([^`]+)`/g, "<code>$1</code>").replace(/\*\*(.*?)\*\*/g, "<strong>$1</strong>").replace(/(?<!\*)\*([^*]+)\*(?!\*)/g, "<em>$1</em>").replace(/\[([^\]]+)\]\(([^)]+)\)/g, "<a href=\"$2\">$1</a>").replace(/^### (.*$)/gm, "<h4>$1</h4>").replace(/^## (.*$)/gm, "<h3>$1</h3>").replace(/^# (.*$)/gm, "<h2>$1</h2>").replace(/^[-*] (.*$)/gm, "<div style=\"display:flex;gap:8px;padding:2px 0\"><span style=\"opacity:0.5\">•</span><span>$1</span></div>").replace(/^(\d+)\. (.*$)/gm, "<div style=\"display:flex;gap:8px;padding:2px 0\"><span style=\"opacity:0.5\">$1.</span><span>$2</span></div>").replace(/\n\n/g, "<div style=\"height:8px\"></div>").replace(/\n/g, "<br>");
-	result = result.replace(codeBlockTokenPattern, (_m, idx) => codeBlocks[Number(idx)]);
-	return result;
+	return items.length > 0 ? {
+		items,
+		nextIndex: i
+	} : null;
+}
+function isMarkdownBlockStart(lines, index) {
+	const line = lines[index];
+	const trimmed = line.trim();
+	return getCodeBlockTokenIndex(trimmed) !== null || isHorizontalRule(trimmed) || Boolean(getHeading(trimmed)) || isTableRow(line) && index + 1 < lines.length && isTableSeparator(lines[index + 1]) || Boolean(collectListItems(lines, index, "unordered")) || Boolean(collectListItems(lines, index, "ordered"));
+}
+function renderInlineMarkdown(text) {
+	const inlineCodeTokens = [];
+	let result = escapeHtml(text).replace(/`([^`]+)`/g, (_match, code) => {
+		inlineCodeTokens.push(`<code>${code}</code>`);
+		return `${codeBlockTokenBoundary}IC${inlineCodeTokens.length - 1}${codeBlockTokenBoundary}`;
+	});
+	result = result.replace(/\*\*(.*?)\*\*/g, "<strong>$1</strong>").replace(/(?<!\*)\*([^*]+)\*(?!\*)/g, "<em>$1</em>").replace(/\[([^\]]+)\]\(([^)]+)\)/g, (_match, label, href) => {
+		return `<a href="${escapeAttribute(href)}">${label}</a>`;
+	});
+	return result.replace(new RegExp(`${codeBlockTokenBoundary}IC(\\d+)${codeBlockTokenBoundary}`, "g"), (_match, idx) => inlineCodeTokens[Number(idx)] ?? "");
 }
 function escapeHtml(s) {
 	return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 }
+function escapeAttribute(s) {
+	return escapeHtml(s).replace(/"/g, "&quot;");
+}
+function isHorizontalRule(line) {
+	return /^(?:-{3,}|\*{3,}|_{3,})$/.test(line);
+}
 function isTableRow(line) {
 	const trimmed = line.trim();
 	return trimmed.startsWith("|") && trimmed.endsWith("|") && trimmed.includes("|");
@@ -89,8 +178,8 @@ function isTableSeparator(line) {
 }
 function renderTable(rows) {
 	const parseRow = (row) => row.trim().replace(/^\|/, "").replace(/\|$/, "").split("|").map((c) => c.trim());
-	return `<table>${`<thead><tr>${parseRow(rows[0]).map((c) => `<th>${c}</th>`).join("")}</tr></thead>`}<tbody>${rows.slice(1).map((row) => {
-		return `<tr>${parseRow(row).map((c) => `<td>${c}</td>`).join("")}</tr>`;
+	return `<table>${`<thead><tr>${parseRow(rows[0]).map((c) => `<th>${renderInlineMarkdown(c)}</th>`).join("")}</tr></thead>`}<tbody>${rows.slice(1).map((row) => {
+		return `<tr>${parseRow(row).map((c) => `<td>${renderInlineMarkdown(c)}</td>`).join("")}</tr>`;
 	}).join("")}</tbody></table>`;
 }
 

package/dist/docs-api.mjs

@@ -429,6 +429,35 @@ async function parseAgentFeedbackData(request) {
 		}
 	};
 }
+function buildAgentFeedbackAnalyticsProperties(data, options = {}) {
+	const payloadKeys = Object.keys(data.payload);
+	const context = data.context;
+	return {
+		...options.requestProperties,
+		feedbackKind: "agent",
+		agentFeedbackContext: context,
+		contextPage: context?.page,
+		contextUrl: context?.url,
+		contextSlug: context?.slug,
+		contextLocale: context?.locale,
+		contextSource: context?.source,
+		payloadKeys,
+		payloadFieldCount: payloadKeys.length,
+		hasContext: Boolean(data.context),
+		hasPayload: payloadKeys.length > 0,
+		...typeof options.handled === "boolean" ? { handled: options.handled } : {},
+		...options.reason ? { reason: options.reason } : {},
+		...options.error ? { error: options.error } : {}
+	};
+}
+function buildAgentFeedbackAnalyticsInput(data) {
+	return {
+		feedbackContext: data.context,
+		feedbackPayload: data.payload,
+		agentFeedbackContext: data.context,
+		agentFeedbackPayload: data.payload
+	};
+}
 function validateAgentFeedbackPayload(value, schema, valuePath = "payload") {
 	const schemaType = typeof schema.type === "string" ? schema.type : void 0;
 	if (Array.isArray(schema.enum) && !schema.enum.some((entry) => Object.is(entry, value))) return `${valuePath} must be one of the configured enum values`;
@@ -2845,6 +2874,7 @@ function createDocsAPI(options) {
 						path: url.pathname,
 						properties: {
 							...requestAnalyticsProperties,
+							feedbackKind: "agent",
 							reason: "invalid_body"
 						}
 					});
@@ -2857,11 +2887,12 @@ function createDocsAPI(options) {
 						source: "server",
 						url: request.url,
 						path: url.pathname,
-						properties: {
-							...requestAnalyticsProperties,
+						input: buildAgentFeedbackAnalyticsInput(parsed.data),
+						properties: buildAgentFeedbackAnalyticsProperties(parsed.data, {
+							requestProperties: requestAnalyticsProperties,
 							reason: "invalid_payload",
 							error: payloadError
-						}
+						})
 					});
 					return Response.json({ error: payloadError }, { status: 400 });
 				}
@@ -2871,12 +2902,11 @@ function createDocsAPI(options) {
 						source: "server",
 						url: request.url,
 						path: url.pathname,
-						properties: {
-							...requestAnalyticsProperties,
-							handled: false,
-							payloadKeys: Object.keys(parsed.data.payload),
-							hasContext: Boolean(parsed.data.context)
-						}
+						input: buildAgentFeedbackAnalyticsInput(parsed.data),
+						properties: buildAgentFeedbackAnalyticsProperties(parsed.data, {
+							requestProperties: requestAnalyticsProperties,
+							handled: false
+						})
 					});
 					return Response.json({
 						ok: true,
@@ -2889,12 +2919,11 @@ function createDocsAPI(options) {
 					source: "server",
 					url: request.url,
 					path: url.pathname,
-					properties: {
-						...requestAnalyticsProperties,
-						handled: true,
-						payloadKeys: Object.keys(parsed.data.payload),
-						hasContext: Boolean(parsed.data.context)
-					}
+					input: buildAgentFeedbackAnalyticsInput(parsed.data),
+					properties: buildAgentFeedbackAnalyticsProperties(parsed.data, {
+						requestProperties: requestAnalyticsProperties,
+						handled: true
+					})
 				});
 				return Response.json({
 					ok: true,

package/dist/docs-feedback.mjs

@@ -52,6 +52,22 @@ function buildFeedbackPayload(value, pathname, entry, comment, locale) {
 		locale
 	};
 }
+function buildFeedbackAnalyticsProperties(data) {
+	return {
+		feedbackKind: "page",
+		value: data.value,
+		feedbackValue: data.value,
+		hasComment: Boolean(data.comment),
+		commentLength: data.comment?.length ?? 0,
+		title: data.title,
+		description: data.description,
+		url: data.url,
+		pathname: data.pathname,
+		path: data.path,
+		entry: data.entry,
+		slug: data.slug
+	};
+}
 function ThumbUpIcon() {
 	return /* @__PURE__ */ jsx("svg", {
 		width: "14",
@@ -115,32 +131,40 @@ function DocsFeedback({ pathname, entry, locale, question = "How is this guide?"
 	function handleSelect(value) {
 		setSelected(value);
 		if (status !== "idle") setStatus("idle");
-		if (analytics) emitClientAnalyticsEvent({
-			type: "feedback_select",
-			locale,
-			path: normalizedPathname,
-			properties: {
-				value,
-				slug: resolveSlug(entry, normalizedPathname)
-			}
-		});
+		if (analytics) {
+			const slug = resolveSlug(entry, normalizedPathname);
+			emitClientAnalyticsEvent({
+				type: "feedback_select",
+				locale,
+				path: normalizedPathname,
+				input: { feedbackValue: value },
+				properties: {
+					feedbackKind: "page",
+					value,
+					feedbackValue: value,
+					entry,
+					pathname: normalizedPathname,
+					path: normalizedPathname,
+					slug
+				}
+			});
+		}
 	}
 	async function handleSubmit() {
 		if (!selected || status === "submitting") return;
 		setStatus("submitting");
+		const payload = buildFeedbackPayload(selected, normalizedPathname, entry, comment, locale);
 		try {
-			const payload = buildFeedbackPayload(selected, normalizedPathname, entry, comment, locale);
 			await emitFeedback(payload, onFeedback);
 			if (analytics) emitClientAnalyticsEvent({
 				type: "feedback_submit",
 				locale,
 				path: normalizedPathname,
-				properties: {
-					value: payload.value,
-					slug: payload.slug,
-					hasComment: Boolean(payload.comment),
-					commentLength: payload.comment?.length ?? 0
-				}
+				input: {
+					feedbackValue: payload.value,
+					feedbackComment: payload.comment
+				},
+				properties: buildFeedbackAnalyticsProperties(payload)
 			});
 			setStatus("submitted");
 		} catch {
@@ -148,12 +172,11 @@ function DocsFeedback({ pathname, entry, locale, question = "How is this guide?"
 				type: "feedback_error",
 				locale,
 				path: normalizedPathname,
-				properties: {
-					value: selected,
-					slug: resolveSlug(entry, normalizedPathname),
-					hasComment: Boolean(comment.trim()),
-					commentLength: comment.trim().length
-				}
+				input: {
+					feedbackValue: payload.value,
+					feedbackComment: payload.comment
+				},
+				properties: buildFeedbackAnalyticsProperties(payload)
 			});
 			setStatus("error");
 		}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@farming-labs/theme",
-  "version": "0.2.3",
+  "version": "0.2.5",
   "description": "Theme package for @farming-labs/docs — layout, provider, MDX components, and styles",
   "keywords": [
     "docs",
@@ -145,7 +145,7 @@
     "tsdown": "^0.20.3",
     "typescript": "^5.9.3",
     "vitest": "^4.1.8",
-    "@farming-labs/docs": "0.2.3"
+    "@farming-labs/docs": "0.2.5"
   },
   "peerDependencies": {
     "@farming-labs/docs": ">=0.0.1",

package/styles/ai.css

@@ -924,6 +924,35 @@
   color: inherit;
 }
 
+.fd-ai-bubble-ai h5 {
+  font-size: 0.875rem;
+  font-weight: 600;
+  margin: 8px 0 4px;
+  line-height: 1.4;
+  color: inherit;
+}
+
+.fd-ai-bubble-ai ul,
+.fd-ai-bubble-ai ol {
+  margin: 6px 0 8px;
+  padding-left: 1.25rem;
+}
+
+.fd-ai-bubble-ai li {
+  margin: 3px 0;
+  padding-left: 2px;
+}
+
+.fd-ai-bubble-ai li::marker {
+  color: var(--color-fd-muted-foreground, #71717a);
+}
+
+.fd-ai-bubble-ai .fd-ai-hr {
+  border: 0;
+  border-top: 1px solid var(--color-fd-border, rgba(255, 255, 255, 0.1));
+  margin: 12px 0;
+}
+
 .fd-ai-bubble-ai strong {
   font-weight: 600;
   color: var(--color-fd-foreground, #e4e4e7);
@@ -1251,6 +1280,35 @@
   color: var(--color-fd-foreground, #e4e4e7);
 }
 
+.fd-ai-fm-msg-content h5 {
+  font-size: 0.9375rem;
+  font-weight: 600;
+  margin: 10px 0 4px;
+  line-height: 1.4;
+  color: var(--color-fd-foreground, #e4e4e7);
+}
+
+.fd-ai-fm-msg-content ul,
+.fd-ai-fm-msg-content ol {
+  margin: 8px 0 10px;
+  padding-left: 1.35rem;
+}
+
+.fd-ai-fm-msg-content li {
+  margin: 4px 0;
+  padding-left: 2px;
+}
+
+.fd-ai-fm-msg-content li::marker {
+  color: var(--color-fd-muted-foreground, #71717a);
+}
+
+.fd-ai-fm-msg-content .fd-ai-hr {
+  border: 0;
+  border-top: 1px solid var(--color-fd-border, rgba(255, 255, 255, 0.1));
+  margin: 16px 0;
+}
+
 .fd-ai-fm-msg-content strong {
   font-weight: 600;
   color: var(--color-fd-foreground, #e4e4e7);