@salesforce/ui-bundle-template-app-react-template-b2x 12.3.4 → 12.3.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/CHANGELOG.md CHANGED
@@ -3,6 +3,22 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [12.3.6](https://github.com/salesforce-experience-platform-emu/webapps/compare/v12.3.5...v12.3.6) (2026-09-01)
7
+
8
+ **Note:** Version bump only for package @salesforce/ui-bundle-template-base-sfdx-project
9
+
10
+
11
+
12
+
13
+
14
+ ## [12.3.5](https://github.com/salesforce-experience-platform-emu/webapps/compare/v12.3.4...v12.3.5) (2026-09-01)
15
+
16
+ **Note:** Version bump only for package @salesforce/ui-bundle-template-base-sfdx-project
17
+
18
+
19
+
20
+
21
+
6
22
  ## [12.3.4](https://github.com/salesforce-experience-platform-emu/webapps/compare/v12.3.3...v12.3.4) (2026-09-01)
7
23
 
8
24
  **Note:** Version bump only for package @salesforce/ui-bundle-template-base-sfdx-project
@@ -19,8 +19,8 @@
19
19
  "graphql:schema": "node scripts/get-graphql-schema.mjs"
20
20
  },
21
21
  "dependencies": {
22
- "@salesforce/platform-sdk": "^12.3.4",
23
- "@salesforce/ui-bundle": "^12.3.4",
22
+ "@salesforce/platform-sdk": "^12.3.6",
23
+ "@salesforce/ui-bundle": "^12.3.6",
24
24
  "@tailwindcss/vite": "^4.1.17",
25
25
  "class-variance-authority": "^0.7.1",
26
26
  "clsx": "^2.1.1",
@@ -47,8 +47,8 @@
47
47
  "@graphql-eslint/eslint-plugin": "^4.1.0",
48
48
  "@graphql-tools/utils": "^11.0.0",
49
49
  "@playwright/test": "^1.49.0",
50
- "@salesforce/graphiti": "^12.3.4",
51
- "@salesforce/vite-plugin-ui-bundle": "^12.3.4",
50
+ "@salesforce/graphiti": "^12.3.6",
51
+ "@salesforce/vite-plugin-ui-bundle": "^12.3.6",
52
52
  "@testing-library/jest-dom": "^6.6.3",
53
53
  "@testing-library/react": "^16.1.0",
54
54
  "@testing-library/user-event": "^14.5.2",
@@ -1,6 +1,6 @@
1
1
  import { Outlet, Link, useLocation } from "react-router";
2
2
  import { getAllRoutes } from "./router-utils";
3
- import { useId, useState } from "react";
3
+ import { useEffect, useId, useRef, useState } from "react";
4
4
  import { AuthMenu } from "./features/authentication/menu/AuthMenu";
5
5
  import { Button } from "./components/ui/button";
6
6
  import CustomerWebClientChat from "./components/CustomerWebClientChat";
@@ -9,6 +9,20 @@ export default function AppLayout() {
9
9
  const [isOpen, setIsOpen] = useState(false);
10
10
  const location = useLocation();
11
11
  const navId = useId();
12
+ const outletWrapperRef = useRef<HTMLDivElement>(null);
13
+ const previousPathname = useRef<string | null>(null);
14
+
15
+ useEffect(() => {
16
+ if (previousPathname.current !== null && previousPathname.current !== location.pathname) {
17
+ const wrapper = outletWrapperRef.current;
18
+ const target = wrapper?.querySelector<HTMLElement>("h1, main, [role='main']") ?? wrapper;
19
+ if (target) {
20
+ if (!target.hasAttribute("tabindex")) target.setAttribute("tabindex", "-1");
21
+ target.focus();
22
+ }
23
+ }
24
+ previousPathname.current = location.pathname;
25
+ }, [location.pathname]);
12
26
 
13
27
  const isActive = (path: string) => location.pathname === path;
14
28
 
@@ -31,6 +45,20 @@ export default function AppLayout() {
31
45
 
32
46
  return (
33
47
  <>
48
+ <a
49
+ href="#main-content"
50
+ onClick={(e) => {
51
+ e.preventDefault();
52
+ const content = outletWrapperRef.current;
53
+ if (content) {
54
+ if (!content.hasAttribute("tabindex")) content.setAttribute("tabindex", "-1");
55
+ content.focus();
56
+ }
57
+ }}
58
+ className="sr-only focus:not-sr-only focus:absolute focus:z-50 focus:top-2 focus:left-2 focus:rounded-md focus:bg-white focus:px-4 focus:py-2 focus:text-gray-900 focus:shadow focus:ring-2 focus:ring-gray-900"
59
+ >
60
+ Skip to main content
61
+ </a>
34
62
  <nav className="bg-white border-b border-gray-200">
35
63
  <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
36
64
  <div className="flex justify-between items-center h-16">
@@ -88,7 +116,9 @@ export default function AppLayout() {
88
116
  </div>
89
117
  </div>
90
118
  </nav>
91
- <Outlet />
119
+ <div id="main-content" ref={outletWrapperRef}>
120
+ <Outlet />
121
+ </div>
92
122
  <CustomerWebClientChat
93
123
  orgId="<ORG_ID_15_OR_18_CHAR_00D...>"
94
124
  deploymentName="<EMBEDDED_SERVICE_DEPLOYMENT_NAME>"
@@ -83,8 +83,17 @@ export default function AccountObjectDetail() {
83
83
  error,
84
84
  } = useAsyncData(() => fetchAccountDetail(recordId!), [recordId]);
85
85
 
86
+ const pageTitle = account
87
+ ? `${fieldValue(account.Name) ?? "Account"} | MyApp`
88
+ : error
89
+ ? "Error | MyApp"
90
+ : loading
91
+ ? "Loading Account | MyApp"
92
+ : "Account Not Found | MyApp";
93
+
86
94
  return (
87
95
  <main className="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
96
+ <title>{pageTitle}</title>
88
97
  {/* Loading state */}
89
98
  {loading && <AccountDetailSkeleton />}
90
99
 
@@ -240,7 +249,11 @@ function Section({ title, children }: { title: string; children: React.ReactNode
240
249
  <Collapsible open={open} onOpenChange={setOpen}>
241
250
  <h2>
242
251
  <CollapsibleTrigger className="flex items-center gap-2 cursor-pointer text-lg font-semibold py-2">
243
- {open ? <ChevronDown className="size-5" /> : <ChevronRight className="size-5" />}
252
+ {open ? (
253
+ <ChevronDown aria-hidden="true" className="size-5" />
254
+ ) : (
255
+ <ChevronRight aria-hidden="true" className="size-5" />
256
+ )}
244
257
  {title}
245
258
  </CollapsibleTrigger>
246
259
  </h2>
@@ -294,7 +307,8 @@ function AccountDetailNotFound({ onBack }: { onBack: () => void }) {
294
307
 
295
308
  function AccountDetailSkeleton() {
296
309
  return (
297
- <>
310
+ <div role="status" aria-live="polite">
311
+ <span className="sr-only">Loading account…</span>
298
312
  <Skeleton className="h-8 w-56 mb-4" />
299
313
 
300
314
  <Card>
@@ -343,7 +357,7 @@ function AccountDetailSkeleton() {
343
357
  </div>
344
358
  </CardContent>
345
359
  </Card>
346
- </>
360
+ </div>
347
361
  );
348
362
  }
349
363
 
@@ -2,9 +2,10 @@ import { GlobalSearchBox } from "../features/search";
2
2
 
3
3
  export default function HomePage() {
4
4
  return (
5
- <div className="max-w-2xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
5
+ <main className="max-w-2xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
6
+ <title>Home | MyApp</title>
6
7
  <h1 className="text-2xl font-bold mb-6">Home</h1>
7
8
  <GlobalSearchBox placeholder="Search accounts, contacts, opportunities..." />
8
- </div>
9
+ </main>
9
10
  );
10
11
  }
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "@salesforce/ui-bundle-template-base-sfdx-project",
3
- "version": "12.3.4",
3
+ "version": "12.3.6",
4
4
  "lockfileVersion": 3,
5
5
  "requires": true,
6
6
  "packages": {
7
7
  "": {
8
8
  "name": "@salesforce/ui-bundle-template-base-sfdx-project",
9
- "version": "12.3.4",
9
+ "version": "12.3.6",
10
10
  "license": "SEE LICENSE IN LICENSE.txt",
11
11
  "dependencies": {
12
12
  "fast-xml-parser": "^5.9.3",
package/dist/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salesforce/ui-bundle-template-base-sfdx-project",
3
- "version": "12.3.4",
3
+ "version": "12.3.6",
4
4
  "description": "Base SFDX project template",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "publishConfig": {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salesforce/ui-bundle-template-app-react-template-b2x",
3
- "version": "12.3.4",
3
+ "version": "12.3.6",
4
4
  "description": "Salesforce React external app template",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "author": "",