Contributing

Add an icon

Icons are keyed by a stable snake_case id used in node data, templates and AI output.

1. Register the icon

src/components/nodes/node-icons.tsx

import { SiApachekafka } from "react-icons/si"

export const NodeIcons: Record<string, JSX.Element> = {
  // …
  kafka: <SiApachekafka className="h-4 w-4" />,
}

2. Add it to the palette

src/components/left-sidebar.tsx

{
  title: "Messaging",
  items: [
    { id: "kafka", label: "Kafka", icon: SiApachekafka },
  ],
}

3. Teach the assistant (optional)

src/lib/ai-schema.ts

"icon": "client_web | api_server | kafka | …"

Rules

Use lucide-react or react-icons; no inline SVG blobs.
Size every icon h-4 w-4 so nodes stay aligned.
Keys are snake_case and permanent — renaming one breaks saved diagrams.
Prefer the vendor's own brand icon when the component is a specific product.