[v0.9] Wire up theme in React renderer basic catalog

[jacobsimionato]

Implement plumbing to apply the surface theme (specifically primaryColor) to components in the React basic catalog. This involves setting up CSS variables at the surface level and ensuring components consume them.

This is a child issue of #683.

[jacobsimionato]

Coding agent prompt: Implement plumbing to apply the surface theme (specifically primaryColor) to components in the React basic catalog.

Implementation Strategy

1. Surface Integration: Modify @renderers/react/src/v0_9/A2uiSurface.tsx. In the A2uiSurface component (or its wrapper), read the theme from the surface model.
2. CSS Variable Injection: Apply the primaryColor (if present in theme) as a CSS custom property --a2ui-primary-color on a root wrapper element for the surface.
3. Component Updates: Audit and update components in @renderers/react/src/v0_9/catalog/basic/components/ to use var(--a2ui-primary-color, <fallback>) instead of hardcoded hex values.

Basic Catalog Usage Examples

The primaryColor should be used for:

• Button: Background color for the primary variant.
• Tabs: Border-bottom and text color for the active tab.
• ChoicePicker: Background and border for selected chips, or fill color for active radio/checkboxes.
• Slider: Thumb and track highlight color.
• TextField / CheckBox: Focus ring or active state highlights.

Verification

• Update the React explorer or visual tests to verify that providing a theme in the createSurface message correctly changes the appearance of these components.
• Ensure that if no theme is provided, the components fall back to their default brand colors.

Context

• @renderers/react/src/v0_9/A2uiSurface.tsx
• @renderers/react/src/v0_9/catalog/basic/components/
• @renderers/web_core/src/v0_9/state/surface-model.ts
• @specification/v0_9/json/basic_catalog.json