<!-- source-hash: 3bd75340418a5b66abb898b8ea88df6c -->
A utility function that provides a centralized way to render SVG icons by name, combining Lucide React icons with custom logo components.

## Key Components

- **`renderSvgIcon`** - Main function that maps icon names to React components
- **Icon mapping** - Includes Lucide icons (megaphone, bell, info, star, rocket, package) and custom logos (OpenFrame, OpenMSP, Flamingo)
- **Fallback behavior** - Defaults to Megaphone icon for unrecognized names
- **Props spreading** - Passes through SVG props for styling and accessibility

## Usage Example

```typescript
import { renderSvgIcon } from './icon-utils';

function NotificationBadge() {
  return (
    <div className="notification">
      {renderSvgIcon('bell', { 
        size: 24, 
        className: 'text-blue-500',
        'aria-label': 'Notifications'
      })}
      <span>New messages</span>
    </div>
  );
}

// Using custom logos
function BrandHeader() {
  return (
    <header>
      {renderSvgIcon('openframe-logo', { width: 120, height: 40 })}
      {renderSvgIcon('flamingo', { className: 'brand-icon' })}
    </header>
  );
}

// Unknown icon falls back to megaphone
const unknownIcon = renderSvgIcon('unknown-icon', { size: 16 });
```