feat(ui): introduce flexible UI configuration system with theme and branding support

[ckemmler]

✨ What’s Included
• New uiConfig system:
• Centralized configuration in src/lib/ui-config.ts
• Local overrides via custom-ui-config.ts
• Safe merge logic via get-ui-config.ts
• React Context Provider (UIConfigProvider):
• Makes config and current theme available throughout the app
• Handles dynamic dark/light mode switching
• Applies CSS variables for brand-specific theming
• New custom hook useUIConfig for easy access
• UI enhancements:
• Optional dark mode toggle button (configurable via showThemeToggle)
• Support for custom branding header (brandHeaderWelcome) via injected React component
• Layout adjustments:
• Header now reads from config and supports fallback
• Minor updates to thread component for theme consistency

⸻

⚙️ Benefits
• Makes the UI customizable without forking
• Keeps core layout stable and update-friendly
• Easy to theme per brand or deployment
• Does not require a Node server or rebuild to change look and feel

[vercel]

@ckemmler is attempting to deploy a commit to the LangChain Team on Vercel.

A member of the Team first needs to authorize it.

[ckemmler]

Hi! I’ve submitted this PR for review. I see that some workflow approvals are pending. Let me know if there’s anything I can fix in the meantime—happy to address any feedback!

[dan-n94]

Hi! I really like the additional config options!
I noticed a small issue with dark mode: it looks like the thread history background in the sidebar doesn't update correctly and stays white. Just wanted to flag it in case it's helpful!

[dan-n94]

It would be really nice to display my custom brandHeader above the chat when it started as well. I configured something like this, but this could probably be simplified:

{!chatStarted && config.brand.brandHeaderWelcome ? (
  config.brand.brandHeaderWelcome()
) : !config.layout?.hideBrandHeaderAboveChatBox ? (
  config.brand.brandHeaderWelcome ? (
    config.brand.brandHeaderWelcome()
  ) : (
    <div className="flex items-center gap-3">
      <LangGraphLogoSVG className="h-8 flex-shrink-0" />
      <h1 className="text-2xl font-semibold tracking-tight">
        Agent Chat
      </h1>
    </div>
  )
) : null}