Add classNames field to plugin overrides for styling customization

[olliethedev]

Problem

Currently, consumers who want to customize the styling of plugin UI components have two options:

1. Override entire components (e.g., PostCard, Link) - heavy-handed for simple style tweaks
2. Use global CSS targeting internal class names - brittle and prone to breaking

There's no middle ground for targeted style customization without replacing entire components.

Proposed Solution

Add a classNames field to each plugin's overrides interface that allows consumers to pass custom class names for specific UI elements:

interface BlogPluginOverrides {
  // ... existing overrides
  
  classNames?: {
    container?: string;
    postCard?: string;
    postTitle?: string;
    postMeta?: string;
    tagsList?: string;
    pagination?: string;
    // etc.
  };
}

Example Usage

<BetterStackProvider
  overrides={{
    blog: {
      navigate: router.push,
      classNames: {
        container: "max-w-4xl mx-auto",
        postCard: "shadow-lg hover:shadow-xl",
        postTitle: "font-serif text-3xl",
      },
    },
  }}
>

Benefits

• Lightweight customization without component replacement
• Type-safe - consumers get autocomplete for available slots
• Non-breaking - all fields optional with sensible defaults
• Tailwind-friendly - works naturally with utility classes

Scope

Add classNames field to:

• BlogPluginOverrides
• AiChatPluginOverrides
• CMSPluginOverrides
• FormBuilderPluginOverrides