@salesforce/ui-bundle-template-app-react-sample-b2e 12.8.0 → 12.9.0

package/dist/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [12.9.0](https://github.com/salesforce-experience-platform-emu/webapps/compare/v12.8.0...v12.9.0) (2026-09-29)
+
+**Note:** Version bump only for package @salesforce/ui-bundle-template-base-sfdx-project
+
+
+
+
+
 ## [12.8.0](https://github.com/salesforce-experience-platform-emu/webapps/compare/v12.7.0...v12.8.0) (2026-09-23)
 
 **Note:** Version bump only for package @salesforce/ui-bundle-template-base-sfdx-project

package/dist/force-app/main/default/uiBundles/propertymanagementapp/package.json

@@ -19,8 +19,8 @@
     "graphql:schema": "node scripts/get-graphql-schema.mjs"
   },
   "dependencies": {
-    "@salesforce/platform-sdk": "^12.8.0",
-    "@salesforce/ui-bundle": "^12.8.0",
+    "@salesforce/platform-sdk": "^12.9.0",
+    "@salesforce/ui-bundle": "^12.9.0",
     "@tailwindcss/vite": "^4.1.17",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
@@ -47,8 +47,8 @@
     "@graphql-eslint/eslint-plugin": "^4.1.0",
     "@graphql-tools/utils": "^11.0.0",
     "@playwright/test": "^1.49.0",
-    "@salesforce/graphiti": "^12.8.0",
-    "@salesforce/vite-plugin-ui-bundle": "^12.8.0",
+    "@salesforce/graphiti": "^12.9.0",
+    "@salesforce/vite-plugin-ui-bundle": "^12.9.0",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.1.0",
     "@testing-library/user-event": "^14.5.2",

package/dist/force-app/main/default/uiBundles/propertymanagementapp/src/features/search/components/controls/PaginationControls.tsx

@@ -107,11 +107,7 @@ export function PaginationControls({
 				<Label htmlFor={selectId} className="text-sm font-normal whitespace-nowrap">
 					Results per page:
 				</Label>
-				<Select
-					value={pageSize.toString()}
-					onValueChange={handlePageSizeChange}
-					disabled={disabled}
-				>
+				<Select value={pageSize.toString()} onValueChange={handlePageSizeChange}>
 					<SelectTrigger id={selectId} className="w-16">
 						<SelectValue />
 					</SelectTrigger>

package/dist/force-app/main/default/uiBundles/propertymanagementapp/src/features/search/components/results/CmsResultRow.tsx

@@ -20,6 +20,11 @@ import { Link } from "react-router";
 import type { CmsSourceConfig, CmsSearchItem } from "../../adapters/cms/types";
 import { formatContentTypeLabel, isValidCmsFqn } from "../../adapters/cms/contentTypeUtils";
 
+const EM_BLOCK_SPLIT = /(<(?:em)>[\s\S]*?<\/(?:em)>)/g;
+const EM_BLOCK_EXEC = /^<(?:em)>([\s\S]*?)<\/(?:em)>$/;
+const STRAY_TAG = /<\/?[a-zA-Z][^>]*>/g;
+const ROUTE_TOKEN = /:([A-Za-z_][A-Za-z0-9_]*)/g;
+
 /** Formats an ISO date string for display; echoes the raw string on failure. */
 function formatPublishedDate(dateStr: string): string {
 	const date = new Date(dateStr);
@@ -43,7 +48,7 @@ function resolveRoute(pattern: string, item: CmsSearchItem): string | null {
 		contentType: item.contentType,
 	};
 	let failed = false;
-	const out = pattern.replace(/:([A-Za-z_][A-Za-z0-9_]*)/g, (_match, token: string) => {
+	const out = pattern.replace(ROUTE_TOKEN, (_match, token: string) => {
 		const value = tokens[token];
 		if (value == null || value === "") {
 			failed = true;
@@ -54,6 +59,44 @@ function resolveRoute(pattern: string, item: CmsSearchItem): string | null {
 	return failed ? null : out;
 }
 
+/**
+ * - Decodes every HTML entity the browser knows (named + numeric).
+ * - Runs twice to unwrap the double-encoding CMS search sometimes returns.
+ */
+function decodeEntities(input: string): string {
+	if (typeof document === "undefined") return input;
+	const el = document.createElement("textarea");
+	const pass = (s: string) => {
+		el.innerHTML = s;
+		return el.value;
+	};
+	return pass(pass(input));
+}
+
+/**
+ * Parses a snippet that may contain `<em>…</em>` segments and renders it as highlighted text,
+ * and strips any other HTML tags so their content renders as plain text.
+ */
+function renderHighlightedSnippet(snippet: string): ReactNode[] {
+	const decoded = decodeEntities(snippet);
+	const parts = decoded.split(EM_BLOCK_SPLIT);
+	return parts.map((part, i) => {
+		const emphasisMatch = EM_BLOCK_EXEC.exec(part);
+		if (emphasisMatch) {
+			return (
+				<mark key={i} className="bg-yellow-200 dark:bg-yellow-700/60 rounded-sm px-0.5">
+					{emphasisMatch[1].replace(STRAY_TAG, "")}
+				</mark>
+			);
+		}
+		return part.replace(STRAY_TAG, "");
+	});
+}
+
+function toPlainText(raw: string): string {
+	return decodeEntities(raw).replace(STRAY_TAG, "");
+}
+
 interface CmsResultRowProps {
 	node: unknown;
 	source: CmsSourceConfig;
@@ -71,9 +114,11 @@ export function CmsResultRow({ node, source }: CmsResultRowProps) {
 
 	const content: ReactNode = (
 		<>
-			<span className="font-medium">{item.title ?? "—"}</span>
+			<span className="font-medium">{item.title ? renderHighlightedSnippet(item.title) : "—"}</span>
 			{item.highlightedSnippet && (
-				<p className="text-sm text-neutral-600 dark:text-neutral-300">{item.highlightedSnippet}</p>
+				<p className="text-sm text-neutral-600 dark:text-neutral-300">
+					{renderHighlightedSnippet(item.highlightedSnippet)}
+				</p>
 			)}
 			{subtitleParts.length > 0 && (
 				<p className="text-sm text-neutral-600 dark:text-neutral-300">
@@ -92,7 +137,7 @@ export function CmsResultRow({ node, source }: CmsResultRowProps) {
 			<Link
 				to={href}
 				className="block hover:bg-accent rounded-md px-3 -mx-3 py-1 transition-colors"
-				aria-label={`View content: ${item.title ?? "content"}`}
+				aria-label={`View content: ${item.title ? toPlainText(item.title) : "content"}`}
 			>
 				{content}
 			</Link>

package/dist/force-app/main/default/uiBundles/propertymanagementapp/src/features/search/components/results/__tests__/CmsResultRow.test.tsx

@@ -108,6 +108,62 @@ describe("CmsResultRow", () => {
 		});
 	});
 
+	describe("highlight and entity decoding", () => {
+		it("converts <em> blocks to <mark> elements", () => {
+			const item: CmsSearchItem = {
+				...baseItem,
+				highlightedSnippet: "the <em>king</em> returns",
+			};
+			const container = renderWithRouter(<CmsResultRow node={item} source={source} />);
+
+			const mark = container.querySelector("mark");
+			expect(mark).toBeTruthy();
+			expect(mark?.textContent).toBe("king");
+		});
+
+		it("decodes double-encoded entities from CMS search", () => {
+			const item: CmsSearchItem = {
+				...baseItem,
+				highlightedSnippet: "&amp;#39;<em>king</em>&amp;#39;",
+			};
+			const container = renderWithRouter(<CmsResultRow node={item} source={source} />);
+
+			expect(container.textContent).toContain("'king'");
+			expect(container.textContent).not.toContain("&amp;");
+		});
+
+		it("strips stray HTML tags but keeps their text content", () => {
+			const item: CmsSearchItem = {
+				...baseItem,
+				highlightedSnippet: "<em>hi<b>bold</b>there</em> <p>plain</p>",
+			};
+			const container = renderWithRouter(<CmsResultRow node={item} source={source} />);
+
+			expect(container.querySelector("mark")?.textContent).toBe("hiboldthere");
+			expect(container.innerHTML).not.toContain("<b>");
+			expect(container.innerHTML).not.toContain("<p>");
+		});
+
+		it("handles the real CMS response pattern end-to-end", () => {
+			const item: CmsSearchItem = {
+				...baseItem,
+				title: "Inside the &#39;<em>King</em>&#39; &mdash; What&#39;s Going On",
+				highlightedSnippet: "Inside the &amp;#39;<em>king</em>&amp;#39; of the industry.",
+			};
+			const container = renderWithRouter(<CmsResultRow node={item} source={source} />);
+
+			expect(container.querySelector("span.font-medium")?.textContent).toContain(
+				"Inside the 'King' — What's Going On",
+			);
+			expect(container.querySelector("span.font-medium mark")?.textContent).toBe("King");
+			const snippet = Array.from(container.querySelectorAll("p")).find((p) =>
+				p.textContent?.includes("industry"),
+			);
+			expect(snippet?.querySelector("mark")?.textContent).toBe("king");
+			expect(snippet?.textContent).not.toContain("&amp;");
+		});
+	});
+
 	describe("subtitle contrast (WCAG 2.2 SC 1.4.3)", () => {
 		it("renders subtitle and snippet with a contrast-safe class, not text-muted-foreground", () => {
 			const item: CmsSearchItem = {

package/dist/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@salesforce/ui-bundle-template-base-sfdx-project",
-  "version": "12.8.0",
+  "version": "12.9.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@salesforce/ui-bundle-template-base-sfdx-project",
-      "version": "12.8.0",
+      "version": "12.9.0",
       "license": "SEE LICENSE IN LICENSE.txt",
       "dependencies": {
         "fast-xml-parser": "^5.9.3",

package/dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salesforce/ui-bundle-template-base-sfdx-project",
-  "version": "12.8.0",
+  "version": "12.9.0",
   "description": "Base SFDX project template",
   "license": "SEE LICENSE IN LICENSE.txt",
   "publishConfig": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salesforce/ui-bundle-template-app-react-sample-b2e",
-  "version": "12.8.0",
+  "version": "12.9.0",
   "description": "Salesforce sample property rental React app",
   "license": "SEE LICENSE IN LICENSE.txt",
   "author": "",
@@ -16,7 +16,7 @@
     "clean": "rm -rf dist"
   },
   "dependencies": {
-    "@salesforce/ui-bundle": "^12.8.0",
+    "@salesforce/ui-bundle": "^12.9.0",
     "sonner": "^1.7.0"
   },
   "devDependencies": {