@schandlergarcia/sf-web-components 2.3.17 → 2.4.0

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

@@ -1,13 +0,0 @@
-export default function Search() {
-	return (
-		<div className="flex min-h-[80vh] items-center justify-center px-4 sm:px-6 lg:px-8 bg-slate-50 dark:bg-slate-950 transition-colors">
-			<div className="w-full max-w-4xl">
-				<div className="text-center mb-8">
-					<h1 className="text-4xl font-bold text-slate-900 dark:text-slate-50 mb-4">Search</h1>
-					<p className="text-lg text-slate-600 dark:text-slate-300">Find records across your organization.</p>
-				</div>
-				<p className="text-center text-slate-500 dark:text-slate-400">Search functionality coming soon...</p>
-			</div>
-		</div>
-	);
-}

package/brands/engine/app/router-utils.tsx

@@ -1,35 +0,0 @@
-import type { RouteObject } from 'react-router';
-import { routes } from './routes';
-
-export type RouteWithFullPath = RouteObject & { fullPath: string };
-
-const flatMapRoutes = (
-  route: RouteObject,
-  parentPath: string = ''
-): RouteWithFullPath[] => {
-  let fullPath: string;
-
-  if (route.index) {
-    fullPath = parentPath || '/';
-  } else if (route.path) {
-    if (route.path.startsWith('/')) {
-      fullPath = route.path;
-    } else {
-      fullPath =
-        parentPath === '/' ? `/${route.path}` : `${parentPath}/${route.path}`;
-    }
-  } else {
-    fullPath = parentPath;
-  }
-
-  const routeWithPath = { ...route, fullPath };
-
-  const childRoutes =
-    route.children?.flatMap(child => flatMapRoutes(child, fullPath)) || [];
-
-  return [routeWithPath, ...childRoutes];
-};
-
-export const getAllRoutes = (): RouteWithFullPath[] => {
-  return routes.flatMap(route => flatMapRoutes(route));
-};

package/brands/engine/app/routes.tsx

@@ -1,39 +0,0 @@
-import type { RouteObject } from 'react-router';
-import AppLayout from './appLayout';
-import Home from './pages/Home';
-import DataTest from './pages/DataTest';
-import AccountSearch from './features/object-search/__examples__/pages/AccountSearch';
-import AccountObjectDetailPage from './features/object-search/__examples__/pages/AccountObjectDetailPage';
-import NotFound from './pages/NotFound';
-
-export const routes: RouteObject[] = [
-  {
-    path: "/",
-    element: <AppLayout />,
-    children: [
-      {
-        index: true,
-        element: <Home />,
-        handle: { showInNavigation: true, showNavBar: true, label: "Partner Hub" }
-      },
-      {
-        path: 'data-test',
-        element: <DataTest />,
-        handle: { showInNavigation: true, showNavBar: true, label: "Data Test" }
-      },
-      {
-        path: 'accounts',
-        element: <AccountSearch />,
-        handle: { showInNavigation: true, showNavBar: true, label: "Accounts" }
-      },
-      {
-        path: 'accounts/:recordId',
-        element: <AccountObjectDetailPage />
-      },
-      {
-        path: '*',
-        element: <NotFound />
-      }
-    ]
-  }
-];

package/brands/engine/app/styles/global.css

@@ -1,269 +0,0 @@
-@import '@heroui/styles';
-
-@layer base {
-  html,
-  body,
-  #root {
-    @apply min-h-screen;
-  }
-
-  body {
-    @apply antialiased bg-white;
-  }
-}
-
-@import 'tw-animate-css';
-@import 'shadcn/tailwind.css';
-
-@custom-variant dark (&:is(.dark *));
-
-@source "../components/library";
-@source "../components/pages";
-
-@theme inline {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --color-card: var(--card);
-  --color-card-foreground: var(--card-foreground);
-  --color-popover: var(--popover);
-  --color-popover-foreground: var(--popover-foreground);
-  --color-primary: var(--primary);
-  --color-primary-foreground: var(--primary-foreground);
-  --color-secondary: var(--secondary);
-  --color-secondary-foreground: var(--secondary-foreground);
-  --color-muted: var(--muted);
-  --color-muted-foreground: var(--muted-foreground);
-  --color-accent: var(--accent);
-  --color-accent-foreground: var(--accent-foreground);
-  --color-destructive: var(--destructive);
-  --color-destructive-foreground: var(--destructive-foreground);
-  --color-border: var(--border);
-  --color-input: var(--input);
-  --color-ring: var(--ring);
-  --color-chart-1: var(--chart-1);
-  --color-chart-2: var(--chart-2);
-  --color-chart-3: var(--chart-3);
-  --color-chart-4: var(--chart-4);
-  --color-chart-5: var(--chart-5);
-  --radius-sm: calc(var(--radius) - 4px);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-lg: var(--radius);
-  --radius-xl: calc(var(--radius) + 4px);
-  --color-sidebar: var(--sidebar);
-  --color-sidebar-foreground: var(--sidebar-foreground);
-  --color-sidebar-primary: var(--sidebar-primary);
-  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
-  --color-sidebar-accent: var(--sidebar-accent);
-  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
-  --color-sidebar-border: var(--sidebar-border);
-  --color-sidebar-ring: var(--sidebar-ring);
-
-  /* Engine brand palette — official guidelines */
-  --color-engine-black:  #0D1117;
-  --color-engine-cyan:   #7DCBD9;
-  --color-engine-green:  #1E9D6D;
-  --color-engine-blue:   #157DE5;
-  --color-engine-orange: #FD4B23;
-  --color-engine-amber:  #FFB200;
-  --color-engine-bg:     #F3F3F4;
-  --color-engine-border: #B0B1B3;
-  --color-engine-text:   #0D1117;
-  --color-engine-muted:  #616368;
-  --color-engine-label:  #B0B1B3;
-
-  /* Engine Cyan brand ramp */
-  --color-brand-50:  #F0FAFB;
-  --color-brand-100: #D9F2F5;
-  --color-brand-200: #B3E5EB;
-  --color-brand-300: #7DCBD9;
-  --color-brand-400: #5BB8CA;
-  --color-brand-500: #3AA0B5;
-  --color-brand-600: #2D849A;
-  --color-brand-700: #266B7E;
-  --color-brand-800: #235768;
-  --color-brand-900: #1F4858;
-  --color-brand-950: #112E3A;
-
-  --font-sans: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
-  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
-
-  --radius-pill: 9999px;
-  --radius-card: 10px;
-}
-
-:root {
-  --dash-text:    #0D1117;
-  --dash-muted:   #3d4047;
-  --dash-label:   #8b8d91;
-  --dash-surface: #fef9ef;
-  --dash-border:  #e2c97a;
-  --dash-accent:  #FFB200;
-  --dash-success: #34d399;
-  --dash-info:    #67e8f9;
-  --dash-warning: #FD4B23;
-  --dash-danger:  #dc2626;
-  --dash-dark:    #0D1117;
-  --dash-darker:  #06090d;
-  --dash-chart-1: #FFB200;
-  --dash-chart-2: #1E9D6D;
-  --dash-chart-3: #7DCBD9;
-  --dash-chart-4: #FD4B23;
-  --dash-metric-size: 2.5rem;
-  --dash-metric-sub: 2.25rem;
-  --color-dash-text:    var(--dash-text);
-  --color-dash-muted:   var(--dash-muted);
-  --color-dash-label:   var(--dash-label);
-  --color-dash-surface: var(--dash-surface);
-  --color-dash-border:  var(--dash-border);
-  --color-dash-accent:  var(--dash-accent);
-  --color-dash-success: var(--dash-success);
-  --color-dash-info:    var(--dash-info);
-  --color-dash-warning: var(--dash-warning);
-  --color-dash-danger:  var(--dash-danger);
-  --color-dash-dark:    var(--dash-dark);
-  --color-dash-darker:  var(--dash-darker);
-  --color-dash-chart-1: var(--dash-chart-1);
-  --color-dash-chart-2: var(--dash-chart-2);
-  --color-dash-chart-3: var(--dash-chart-3);
-  --color-dash-chart-4: var(--dash-chart-4);
-
-  --radius: 0.625rem;
-  --background: oklch(1 0 0);
-  --foreground: oklch(0.145 0 0);
-  --card: oklch(1 0 0);
-  --card-foreground: oklch(0.145 0 0);
-  --popover: oklch(1 0 0);
-  --popover-foreground: oklch(0.145 0 0);
-  --primary: oklch(0.205 0 0);
-  --primary-foreground: oklch(0.985 0 0);
-  --secondary: oklch(0.97 0 0);
-  --secondary-foreground: oklch(0.205 0 0);
-  --muted: oklch(0.97 0 0);
-  --muted-foreground: oklch(0.556 0 0);
-  --accent: oklch(0.97 0 0);
-  --accent-foreground: oklch(0.205 0 0);
-  --destructive: oklch(0.577 0.245 27.325);
-  --border: oklch(0.922 0 0);
-  --input: oklch(0.922 0 0);
-  --ring: oklch(0.708 0 0);
-  --chart-1: oklch(0.646 0.222 41.116);
-  --chart-2: oklch(0.6 0.118 184.704);
-  --chart-3: oklch(0.398 0.07 227.392);
-  --chart-4: oklch(0.828 0.189 84.429);
-  --chart-5: oklch(0.769 0.188 70.08);
-  --sidebar: oklch(0.985 0 0);
-  --sidebar-foreground: oklch(0.145 0 0);
-  --sidebar-primary: oklch(0.205 0 0);
-  --sidebar-primary-foreground: oklch(0.985 0 0);
-  --sidebar-accent: oklch(0.97 0 0);
-  --sidebar-accent-foreground: oklch(0.205 0 0);
-  --sidebar-border: oklch(0.922 0 0);
-  --sidebar-ring: oklch(0.708 0 0);
-}
-
-.dark {
-  --background: oklch(0.145 0 0);
-  --foreground: oklch(0.985 0 0);
-  --card: oklch(0.205 0 0);
-  --card-foreground: oklch(0.985 0 0);
-  --popover: oklch(0.205 0 0);
-  --popover-foreground: oklch(0.985 0 0);
-  --primary: oklch(0.922 0 0);
-  --primary-foreground: oklch(0.205 0 0);
-  --secondary: oklch(0.269 0 0);
-  --secondary-foreground: oklch(0.985 0 0);
-  --muted: oklch(0.269 0 0);
-  --muted-foreground: oklch(0.708 0 0);
-  --accent: oklch(0.269 0 0);
-  --accent-foreground: oklch(0.985 0 0);
-  --destructive: oklch(0.704 0.191 22.216);
-  --border: oklch(1 0 0 / 10%);
-  --input: oklch(1 0 0 / 15%);
-  --ring: oklch(0.556 0 0);
-  --chart-1: oklch(0.488 0.243 264.376);
-  --chart-2: oklch(0.696 0.17 162.48);
-  --chart-3: oklch(0.769 0.188 70.08);
-  --chart-4: oklch(0.627 0.265 303.9);
-  --chart-5: oklch(0.645 0.246 16.439);
-  --sidebar: oklch(0.205 0 0);
-  --sidebar-foreground: oklch(0.985 0 0);
-  --sidebar-primary: oklch(0.488 0.243 264.376);
-  --sidebar-primary-foreground: oklch(0.985 0 0);
-  --sidebar-accent: oklch(0.269 0 0);
-  --sidebar-accent-foreground: oklch(0.985 0 0);
-  --sidebar-border: oklch(1 0 0 / 10%);
-  --sidebar-ring: oklch(0.556 0 0);
-}
-
-@layer base {
-  * {
-    @apply border-border outline-ring/50;
-  }
-  body {
-    @apply bg-background text-foreground;
-  }
-}
-
-/*
- * Restore HeroUI theme variables inside the Command Center scope.
- * Uses Engine brand colors: Cyan #7DCBD9 as secondary, Orange-Red #FD4B23 as danger.
- */
-.heroui-scope {
-  --primary: #0D1117;
-  --primary-foreground: oklch(0.9911 0 0);
-  --secondary: #7DCBD9;
-  --secondary-foreground: #0D1117;
-  --success: #1E9D6D;
-  --success-foreground: oklch(0.9911 0 0);
-  --warning: #FFB200;
-  --warning-foreground: #0D1117;
-  --danger: #FD4B23;
-  --danger-foreground: oklch(0.9911 0 0);
-
-  --muted: oklch(0.5517 0.0138 285.94);
-  --accent: oklch(0.6204 0.195 253.83);
-  --accent-foreground: oklch(0.9911 0 0);
-  --background: #F3F3F4;
-  --foreground: #0D1117;
-  --default: oklch(94% 0.001 286.375);
-  --default-foreground: #0D1117;
-  --border: #B0B1B3;
-  --separator: oklch(92% 0.004 286.32);
-  --segment: oklch(100% 0 0);
-  --segment-foreground: #0D1117;
-  --surface: oklch(100% 0 0);
-  --surface-foreground: #0D1117;
-  --overlay: oklch(100% 0 0);
-  --overlay-foreground: #0D1117;
-  --focus: #157DE5;
-  --link: #0D1117;
-}
-
-/* ChatBar expanded overlay — horizontal padding so it doesn't hit window edges */
-body > .fixed.inset-x-0.rounded-2xl {
-  left: 1.5rem !important;
-  right: 1.5rem !important;
-}
-
-.dark .heroui-scope,
-.heroui-scope.dark {
-  --muted: oklch(70.5% 0.015 286.067);
-  --background: oklch(12% 0.005 285.823);
-  --foreground: oklch(0.9911 0 0);
-  --default: oklch(27.4% 0.006 286.033);
-  --default-foreground: oklch(0.9911 0 0);
-  --border: oklch(28% 0.006 286.033);
-  --separator: oklch(25% 0.006 286.033);
-  --segment: oklch(0.3964 0.01 285.93);
-  --segment-foreground: oklch(0.9911 0 0);
-  --surface: oklch(0.2103 0.0059 285.89);
-  --surface-foreground: oklch(0.9911 0 0);
-  --overlay: oklch(0.2103 0.0059 285.89);
-  --overlay-foreground: oklch(0.9911 0 0);
-  --warning: oklch(0.8203 0.1388 76.34);
-  --warning-foreground: #0D1117;
-  --danger: oklch(0.594 0.1967 24.63);
-  --danger-foreground: oklch(0.9911 0 0);
-  --focus: #157DE5;
-  --link: oklch(0.9911 0 0);
-}

package/brands/engine/brand.css

@@ -1,40 +0,0 @@
-/*
- * Engine Brand Overrides
- *
- * Applied on top of the base global.css when `npm run brand:engine` is run.
- * Colors sourced from the official Engine Brand Guidelines.
- *
- * Primary:    Engine Black #0D1117, White #FFFFFF
- * Secondary:  Orange-Red #FD4B23, Amber #FFB200, Green #1E9D6D,
- *             Cyan #7DCBD9, Blue #157DE5
- * Neutrals:   Dark Gray #616368, Mid Gray #B0B1B3, Light Gray #F3F3F4
- */
-
-/* ── Engine brand palette (injected into @theme inline block) ─────────────── */
-
-/*
-  --color-engine-black:    #0D1117
-  --color-engine-cyan:     #7DCBD9   (primary accent)
-  --color-engine-green:    #1E9D6D   (savings, FlexPro, Flex, BestPrice)
-  --color-engine-blue:     #157DE5   (finance, Credit, Charge)
-  --color-engine-orange:   #FD4B23   (secondary accent)
-  --color-engine-amber:    #FFB200   (alerts, warnings)
-  --color-engine-bg:       #F3F3F4   (light gray background)
-  --color-engine-border:   #B0B1B3   (mid gray)
-  --color-engine-text:     #0D1117   (engine black)
-  --color-engine-muted:    #616368   (dark gray)
-  --color-engine-label:    #B0B1B3   (mid gray)
-
-  Brand ramp (built from Cyan #7DCBD9):
-  --color-brand-50:   #F0FAFB
-  --color-brand-100:  #D9F2F5
-  --color-brand-200:  #B3E5EB
-  --color-brand-300:  #7DCBD9   (Cyan — primary)
-  --color-brand-400:  #5BB8CA
-  --color-brand-500:  #3AA0B5
-  --color-brand-600:  #2D849A
-  --color-brand-700:  #266B7E
-  --color-brand-800:  #235768
-  --color-brand-900:  #1F4858
-  --color-brand-950:  #112E3A
-*/