@salesforce/ui-bundle-template-app-react-sample-b2e 11.8.4 → 11.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.
 
+## [11.9.0](https://github.com/salesforce-experience-platform-emu/webapps/compare/v11.8.4...v11.9.0) (2026-07-07)
+
+**Note:** Version bump only for package @salesforce/ui-bundle-template-base-sfdx-project
+
+
+
+
+
 ## [11.8.4](https://github.com/salesforce-experience-platform-emu/webapps/compare/v11.8.3...v11.8.4) (2026-07-07)
 
 **Note:** Version bump only for package @salesforce/ui-bundle-template-base-sfdx-project

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

@@ -18,8 +18,8 @@
     "graphql:schema": "node scripts/get-graphql-schema.mjs"
   },
   "dependencies": {
-    "@salesforce/platform-sdk": "^11.8.4",
-    "@salesforce/ui-bundle": "^11.8.4",
+    "@salesforce/platform-sdk": "^11.9.0",
+    "@salesforce/ui-bundle": "^11.9.0",
     "@tailwindcss/vite": "^4.1.17",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
@@ -46,8 +46,8 @@
     "@graphql-eslint/eslint-plugin": "^4.1.0",
     "@graphql-tools/utils": "^11.0.0",
     "@playwright/test": "^1.49.0",
-    "@salesforce/graphiti": "^11.8.4",
-    "@salesforce/vite-plugin-ui-bundle": "^11.8.4",
+    "@salesforce/graphiti": "^11.9.0",
+    "@salesforce/vite-plugin-ui-bundle": "^11.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/appLayout.tsx

@@ -11,6 +11,12 @@ export default function AppLayout() {
 	return (
 		<div className="flex flex-col">
 			<Toaster />
+			<a
+				href="#main-content"
+				className="sr-only focus:not-sr-only focus:absolute focus:left-4 focus:top-4 focus:z-50 focus:rounded-md focus:bg-white focus:px-4 focus:py-2 focus:text-purple-700 focus:shadow-lg focus:outline focus:outline-2 focus:outline-purple-700"
+			>
+				Skip to main content
+			</a>
 			{/* Top Bar */}
 			<TopBar onMenuClick={() => setIsNavOpen(true)} />
 
@@ -20,7 +26,7 @@ export default function AppLayout() {
 				<VerticalNav isOpen={isNavOpen} onClose={() => setIsNavOpen(false)} />
 
 				{/* Page Content */}
-				<main className="flex-1 overflow-auto">
+				<main id="main-content" className="flex-1 overflow-auto">
 					<Outlet />
 				</main>
 			</div>

package/dist/force-app/main/default/uiBundles/propertymanagementapp/src/components/dashboard/IssuesDonutChart.tsx

@@ -2,7 +2,6 @@ import React from "react";
 import { PieChart, Pie, Cell, ResponsiveContainer, Tooltip } from "recharts";
 import { Card } from "../ui/card";
 import { Skeleton } from "../ui/skeleton";
-import { MoreVertical } from "lucide-react";
 
 interface ChartData {
 	name: string;
@@ -58,14 +57,6 @@ export const IssuesDonutChart: React.FC<IssuesDonutChartProps> = ({ data, loadin
 
 	return (
 		<Card className="p-4 border-gray-200 shadow-sm flex flex-col relative">
-			{/* Three-dot menu */}
-			<button
-				className="absolute top-4 right-4 p-1 hover:bg-gray-100 rounded-md transition-colors z-10"
-				aria-label="More options"
-			>
-				<MoreVertical className="w-4 h-4 text-gray-400" />
-			</button>
-
 			<h3 className="text-sm font-medium text-primary-purple mb-2 uppercase tracking-wide">
 				Top Maintenance Issues
 			</h3>

package/dist/force-app/main/default/uiBundles/propertymanagementapp/src/components/dashboard/StatCard.tsx

@@ -3,7 +3,6 @@ import { Card } from "../ui/card";
 import { Skeleton } from "../ui/skeleton";
 import upgraphIcon from "../../assets/icons/upgraph.svg";
 import downgraphIcon from "../../assets/icons/downgraph.svg";
-import { MoreVertical } from "lucide-react";
 
 interface StatCardProps {
 	title: string;
@@ -30,14 +29,6 @@ export const StatCard: React.FC<StatCardProps> = ({
 			className={`p-4 border-gray-200 shadow-sm relative ${onClick ? "cursor-pointer hover:shadow-lg transition-shadow" : ""}`}
 			onClick={onClick}
 		>
-			{/* Three-dot menu */}
-			<button
-				className="absolute top-4 right-4 p-1 hover:bg-gray-100 rounded-md transition-colors"
-				aria-label="More options"
-			>
-				<MoreVertical className="w-4 h-4 text-gray-400" />
-			</button>
-
 			<div className="space-y-1">
 				<p className="text-sm font-medium text-gray-600 uppercase tracking-wide">{title}</p>
 				{loading ? (

package/dist/force-app/main/default/uiBundles/propertymanagementapp/src/components/layout/TopBar.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from "react";
-import { ChevronDown, Menu } from "lucide-react";
+import { Menu } from "lucide-react";
 import zenLogo from "../../assets/icons/zen-logo.svg";
 import { getUserInfo } from "../../api/dashboard/dashboard";
 
@@ -42,13 +42,15 @@ export const TopBar: React.FC<TopBarProps> = ({ onMenuClick }) => {
 			{/* Right section - Profile */}
 			<div className="flex items-center gap-4">
 				{/* User Profile */}
-				<button className="flex items-center gap-2 px-3 py-2 hover:bg-purple-700 rounded-md transition-colors">
-					<div className="w-8 h-8 bg-purple-300 rounded-full flex items-center justify-center text-purple-900 font-semibold">
+				<div className="flex items-center gap-2 px-3 py-2">
+					<div
+						className="w-8 h-8 bg-purple-300 rounded-full flex items-center justify-center text-purple-900 font-semibold"
+						aria-hidden="true"
+					>
 						{userName.charAt(0).toUpperCase()}
 					</div>
 					<span className="hidden md:inline font-medium">{userName.toUpperCase()}</span>
-					<ChevronDown className="w-4 h-4 hidden md:inline" />
-				</button>
+				</div>
 			</div>
 		</div>
 	);

package/dist/force-app/main/default/uiBundles/propertymanagementapp/src/components/layout/VerticalNav.tsx

@@ -42,6 +42,7 @@ export const VerticalNav: React.FC<VerticalNavProps> = ({ isOpen = false, onClos
 				key={item.path}
 				to={item.path}
 				onClick={handleClick}
+				aria-current={isActive(item.path) ? "page" : undefined}
 				className={`flex flex-col items-center justify-center gap-2 py-4 px-2 transition-colors ${
 					isActive(item.path)
 						? "bg-purple-100 text-purple-700 border-l-4 border-purple-700"
@@ -57,17 +58,23 @@ export const VerticalNav: React.FC<VerticalNavProps> = ({ isOpen = false, onClos
 	return (
 		<>
 			{/* Desktop sidebar */}
-			<div className="hidden md:flex flex-col w-24 bg-white border-r border-gray-200 py-8 space-y-4">
+			<nav
+				aria-label="Main"
+				className="hidden md:flex flex-col w-24 bg-white border-r border-gray-200 py-8 space-y-4"
+			>
 				{navContent()}
-			</div>
+			</nav>
 
 			{/* Mobile overlay */}
 			{isOpen && (
 				<>
 					<div className="fixed inset-0 z-40 bg-black/50" onClick={onClose} aria-hidden />
-					<div className="fixed left-0 top-0 bottom-0 z-50 flex flex-col w-24 bg-white border-r border-gray-200 py-8 space-y-4">
+					<nav
+						aria-label="Main menu"
+						className="fixed left-0 top-0 bottom-0 z-50 flex flex-col w-24 bg-white border-r border-gray-200 py-8 space-y-4"
+					>
 						{navContent(onClose)}
-					</div>
+					</nav>
 				</>
 			)}
 		</>

package/dist/force-app/main/default/uiBundles/propertymanagementapp/src/components/properties/PropertyDetailsModal.tsx

@@ -56,7 +56,7 @@ export const PropertyDetailsModal: React.FC<PropertyDetailsModalProps> = ({
 			case "rented":
 				return "bg-blue-100 text-blue-700";
 			case "maintenance":
-				return "bg-yellow-100 text-yellow-700";
+				return "bg-yellow-100 text-yellow-800";
 			default:
 				return "bg-gray-100 text-gray-700";
 		}

package/dist/force-app/main/default/uiBundles/propertymanagementapp/src/features/object-search/components/filters/FilterFieldWrapper.tsx

@@ -6,6 +6,8 @@ interface FilterFieldWrapperProps extends React.ComponentProps<"div"> {
 	htmlFor?: string;
 	/** id applied to the visible label so a non-native control can reference it via aria-labelledby */
 	labelId?: string;
+	/** id applied to the error message so a control can reference it via aria-describedby */
+	errorId?: string;
 	helpText?: string;
 	error?: string;
 }
@@ -14,6 +16,7 @@ export function FilterFieldWrapper({
 	label,
 	htmlFor,
 	labelId,
+	errorId,
 	helpText,
 	error,
 	className,
@@ -28,7 +31,9 @@ export function FilterFieldWrapper({
 			{children}
 			<div className="min-h-4">
 				{error ? (
-					<p className="text-xs text-destructive">{error}</p>
+					<p id={errorId} role="alert" className="text-xs text-destructive">
+						{error}
+					</p>
 				) : (
 					helpText && <p className="text-xs text-muted-foreground">{helpText}</p>
 				)}

package/dist/force-app/main/default/uiBundles/propertymanagementapp/src/features/object-search/components/filters/NumericRangeFilter.tsx

@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useId, useState } from "react";
 import { Input } from "../../../../components/ui/input";
 
 import { useFilterField } from "../FilterContext";
@@ -62,6 +62,7 @@ export function NumericRangeFilterInputs({
 	className,
 	...props
 }: NumericRangeFilterInputsProps) {
+	const errorId = useId();
 	const [localMin, setLocalMin] = useState(value?.min ?? "");
 	const [localMax, setLocalMax] = useState(value?.max ?? "");
 
@@ -129,6 +130,7 @@ export function NumericRangeFilterInputs({
 			label={label}
 			helpText={helpText}
 			error={errorMessage}
+			errorId={errorId}
 			className={className}
 			{...props}
 		>
@@ -146,6 +148,7 @@ export function NumericRangeFilterInputs({
 					}}
 					aria-label={`${label} minimum`}
 					aria-invalid={hasError || undefined}
+					aria-describedby={hasError ? errorId : undefined}
 				/>
 				<Input
 					type="number"
@@ -160,6 +163,7 @@ export function NumericRangeFilterInputs({
 					}}
 					aria-label={`${label} maximum`}
 					aria-invalid={hasError || undefined}
+					aria-describedby={hasError ? errorId : undefined}
 				/>
 			</div>
 		</FilterFieldWrapper>

package/dist/force-app/main/default/uiBundles/propertymanagementapp/src/pages/ApplicationSearch.tsx

@@ -326,7 +326,7 @@ const getStatusColor = (status: string) => {
 	if (statusLower.includes("approved")) return "bg-green-100 text-green-700";
 	if (statusLower.includes("rejected")) return "bg-red-100 text-red-700";
 	if (statusLower.includes("background")) return "bg-blue-100 text-blue-700";
-	if (statusLower.includes("review")) return "bg-yellow-100 text-yellow-700";
+	if (statusLower.includes("review")) return "bg-yellow-100 text-yellow-800";
 	return "bg-gray-100 text-gray-700";
 };
 

package/dist/force-app/main/default/uiBundles/propertymanagementapp/src/pages/Home.tsx

@@ -131,6 +131,7 @@ export default function Home() {
 	return (
 		<PageContainer>
 			<div className="max-w-7xl mx-auto space-y-6">
+				<h1 className="sr-only">Dashboard</h1>
 				<GlobalSearchBar
 					searchableObjects={SEARCHABLE_OBJECTS}
 					selectedObjectApiName={selectedObjectApiName}

package/dist/force-app/main/default/uiBundles/propertymanagementapp/src/pages/MaintenanceRequestSearch.tsx

@@ -386,7 +386,7 @@ function StatusBadge({ status }: { status: string }) {
 		statusLower === "new"
 			? "bg-pink-100 text-pink-700"
 			: statusLower === "in progress"
-				? "bg-yellow-100 text-yellow-700"
+				? "bg-yellow-100 text-yellow-800"
 				: statusLower === "resolved"
 					? "bg-green-100 text-green-700"
 					: "bg-gray-100 text-gray-700";

package/dist/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@salesforce/webapp-template-base-sfdx-project-experimental",
-  "version": "11.8.4",
+  "version": "11.9.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@salesforce/webapp-template-base-sfdx-project-experimental",
-      "version": "11.8.4",
+      "version": "11.9.0",
       "license": "SEE LICENSE IN LICENSE.txt",
       "devDependencies": {
         "@lwc/eslint-plugin-lwc": "^3.3.0",

package/dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salesforce/ui-bundle-template-base-sfdx-project",
-  "version": "11.8.4",
+  "version": "11.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": "11.8.4",
+  "version": "11.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": "^11.8.4",
+    "@salesforce/ui-bundle": "^11.9.0",
     "sonner": "^1.7.0"
   },
   "devDependencies": {