@aireact/image-caption

🚀 AI-Powered Image Captioning for React

Generate intelligent captions and descriptions for images using AI vision models.

✨ Features

- 🖼️ AI Vision: Powered by OpenAI GPT-4 Vision, Claude, Gemini
- 📝 Rich Descriptions: Detailed, context-aware captions
- 🏷️ Auto Tagging: Generate relevant tags for images
- ♿ Accessibility: Perfect for alt-text generation
- 🎨 Customizable: Control caption style and length
- 🔧 TypeScript: Full TypeScript support

📦 Installation

``bash
npm install @aireact/image-caption @aireact/core
`

🚀 Quick Start

`tsx
import { ImageCaption, useImageCaption } from '@aireact/image-caption';
import '@aireact/image-caption/style.css';

function App() {
return (
provider="openai"
apiKey={process.env.REACT_APP_OPENAI_API_KEY}
model="gpt-4-vision-preview"
src="/path/to/image.jpg"
showCaption={true}
/>
);
}
`

$3

`tsx
import { useImageCaption } from '@aireact/image-caption';

function CustomCaption() {
const {
caption,
tags,
isLoading,
generateCaption
} = useImageCaption({
provider: 'openai',
apiKey: process.env.REACT_APP_OPENAI_API_KEY,
model: 'gpt-4-vision-preview'
});

const handleImageUpload = async (file) => {
await generateCaption(file);
};

return (



);
}
`

📖 Props

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| provider | string | - | AI provider |
| apiKey | string | - | API key |
| model | string | - | Vision model |
| src | string | - | Image source |
| showCaption | boolean | true | Display caption |
| showTags | boolean | false | Display tags |
| style | string | 'detailed' | Caption style |

🎨 Customization

`css
:root {
--aireact-caption-bg: #f5f5f5;
--aireact-caption-text: #333333;
--aireact-caption-tag: #2196f3;
}
``

📦 Related Packages

$3

- @aireact/core - Core AI Client
- @aireact/360-spin - 360° Product Viewer
- @aireact/doc-intelligence - Document AI

$3

- @aivue/image-caption - Vue Image Caption
- @aivue/core - Vue Core AI Client

$3

- @aiangular/image-caption - Angular Image Caption

🔗 More Information

- GitHub Repository
- Full Documentation
- Report Issues

📄 License

MIT © Bharatkumar Subramanian