@schandlergarcia/sf-web-components 2.3.14 → 2.3.16

package/CHANGELOG.md

@@ -5,6 +5,18 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [2.3.16] - 2026-04-14
+
+### Changed
+- **Reduced neutral theme metric sizes for visible brand distinction** — Neutral theme metrics scaled down to `2rem`/`1.5rem` (from `3.25rem`/`2.25rem`) so switching to Engine theme shows a clear visual upgrade. Engine theme retains the larger bold metrics.
+
+## [2.3.15] - 2026-04-14
+
+### Changed
+- **Renamed agent to "Partner Hub Agent"** — Header title changed from "Engine Virtual Agent" to "Partner Hub Agent", subtitle from "Eva · Online" to "Agentforce · Online", and greeting updated to "I'm your Partner Hub assistant".
+- **Removed Booking Segments (Data360Widget) from dashboard** — Removed the Data360Widget import and usage from PartnerHubDashboard. The component file remains in the library for future use.
+- **Simplified appLayout** — Removed the nav bar header; appLayout now renders only the Outlet.
+
 ## [2.3.14] - 2026-04-14
 
 ### Fixed

package/brands/engine/app/appLayout.tsx

@@ -1,90 +1,5 @@
-import { Outlet, Link, useLocation, useMatches } from "react-router";
-import { getAllRoutes } from "./router-utils";
-import { useState } from "react";
+import { Outlet } from "react-router";
 
 export default function AppLayout() {
-	const [isOpen, setIsOpen] = useState(false);
-	const location = useLocation();
-	const matches = useMatches();
-
-	const showNavBar = matches.some(
-		(m) => (m.handle as Record<string, unknown>)?.showNavBar === true,
-	);
-
-	const isActive = (path: string) => location.pathname === path;
-
-	const toggleMenu = () => setIsOpen(!isOpen);
-
-	const navigationRoutes: { path: string; label: string }[] = getAllRoutes()
-		.filter(
-			(route) =>
-				route.handle?.showInNavigation === true &&
-				route.fullPath !== undefined &&
-				route.handle?.label !== undefined,
-		)
-		.map(
-			(route) =>
-				({
-					path: route.fullPath,
-					label: route.handle?.label,
-				}) as { path: string; label: string },
-		);
-
-	return (
-		<>
-			{showNavBar && (
-				<nav className="bg-white border-b border-gray-200">
-					<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-						<div className="flex justify-between items-center h-16">
-							<Link to="/" className="text-xl font-semibold text-gray-900">
-								Partner Hub
-							</Link>
-							<button
-								onClick={toggleMenu}
-								className="p-2 rounded-md text-gray-700 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-blue-500"
-								aria-label="Toggle menu"
-							>
-								<div className="w-6 h-6 flex flex-col justify-center space-y-1.5">
-									<span
-										className={`block h-0.5 w-6 bg-current transition-all ${
-											isOpen ? "rotate-45 translate-y-2" : ""
-										}`}
-									/>
-									<span
-										className={`block h-0.5 w-6 bg-current transition-all ${isOpen ? "opacity-0" : ""}`}
-									/>
-									<span
-										className={`block h-0.5 w-6 bg-current transition-all ${
-											isOpen ? "-rotate-45 -translate-y-2" : ""
-										}`}
-									/>
-								</div>
-							</button>
-						</div>
-						{isOpen && (
-							<div className="pb-4">
-								<div className="flex flex-col space-y-2">
-									{navigationRoutes.map((item) => (
-										<Link
-											key={item.path}
-											to={item.path}
-											onClick={() => setIsOpen(false)}
-											className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${
-												isActive(item.path)
-													? "bg-blue-100 text-blue-700"
-													: "text-gray-700 hover:bg-gray-100"
-											}`}
-										>
-											{item.label}
-										</Link>
-									))}
-								</div>
-							</div>
-						)}
-					</div>
-				</nav>
-			)}
-			<Outlet />
-		</>
-	);
+	return <Outlet />;
 }

package/brands/engine/app/components/AgentPanel.tsx

@@ -22,7 +22,7 @@ const SCRIPT: ScriptStep[] = [
   // --- Auto-play greeting ---
   {
     role: "agent",
-    text: "Hi Jamie! 👋 I'm Eva, your Engine partner assistant. How can I help you today?",
+    text: "Hi Jamie! 👋 I'm your Partner Hub assistant. How can I help you today?",
   },
 
   // --- Prompt 1: Ask about the canceled booking ---
@@ -296,9 +296,9 @@ export default function AgentPanel() {
                 </div>
                 <div>
                   <h3 className="text-sm font-semibold text-white">
-                    Engine Virtual Agent
+                    Partner Hub Agent
                   </h3>
-                  <p className="text-xs text-white/60">Eva · Online</p>
+                  <p className="text-xs text-white/60">Agentforce · Online</p>
                 </div>
               </div>
               <button

package/brands/engine/app/pages/PartnerHubDashboard.tsx

@@ -33,7 +33,6 @@ import {
 } from "@heroicons/react/24/outline";
 import * as d3 from "d3";
 import engineLogo from "@/assets/images/engine_logo.png";
-import Data360Widget from "@/components/Data360Widget";
 
 /**
  * Partner Hub Dashboard
@@ -968,9 +967,6 @@ export default function PartnerHubDashboard() {
           </div>
         </div>
 
-        {/* Data 360 Widget */}
-        <Data360Widget />
-
         {/* Property Leaderboard - NEW SECTION */}
         {isLoading ? (
           <div className="bg-gradient-to-br from-white via-[var(--color-dash-surface)] to-white dark:from-[var(--color-dash-text)] dark:via-[var(--color-dash-dark)] dark:to-[var(--color-dash-text)] rounded-2xl p-8 shadow-xl border border-[var(--color-dash-label)]/20 dark:border-[var(--color-dash-muted)]/30">

package/dist/styles/global.css

@@ -95,8 +95,8 @@
   --dash-chart-2: #16a34a;
   --dash-chart-3: #e11d48;
   --dash-chart-4: #7c3aed;
-  --dash-metric-size: 3.25rem;
-  --dash-metric-sub: 2.25rem;
+  --dash-metric-size: 2rem;
+  --dash-metric-sub: 1.5rem;
   --color-dash-text:    var(--dash-text);
   --color-dash-muted:   var(--dash-muted);
   --color-dash-label:   var(--dash-label);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@schandlergarcia/sf-web-components",
-  "version": "2.3.14",
+  "version": "2.3.16",
   "description": "Reusable Salesforce web components library with Tailwind CSS v4 and shadcn/ui",
   "type": "module",
   "main": "./dist/index.js",

package/src/styles/global.css

@@ -95,8 +95,8 @@
   --dash-chart-2: #16a34a;
   --dash-chart-3: #e11d48;
   --dash-chart-4: #7c3aed;
-  --dash-metric-size: 3.25rem;
-  --dash-metric-sub: 2.25rem;
+  --dash-metric-size: 2rem;
+  --dash-metric-sub: 1.5rem;
   --color-dash-text:    var(--dash-text);
   --color-dash-muted:   var(--dash-muted);
   --color-dash-label:   var(--dash-label);