0.0.2 • Published 4 months ago
react-dalle-fiber v0.0.2
React DALLE Fiber
A React renderer for DALL-E, enabling declarative AI image generation in React applications.
Installation
npm install react-dalle-fiber
Usage
React DALLE Fiber uses a declarative component approach to build AI-generated images. Here's a basic example:
import { Canvas } from 'react-dalle-fiber';
function App() {
return (
<Canvas apiKey={process.env.OPENAI_API_KEY}>
<sky time="night" />
<city />
<drawStyle type="photo" />
</Canvas>
);
}
Key Components
Canvas
The root component that initializes the DALL-E generation context:
<Canvas
apiKey={yourOpenAIKey}
>
{/* Child components that define the image */}
</Canvas>
Image Components
Use declarative components to build your image scene. You can use any JSX you want to express your image.
// Weather and time of day
<sky time="sunset" weather="cloudy" />
// Subjects and environments
<city style="futuristic" />
<person action="walking" outfit="casual" />
<landscape type="mountain" />
// Style control
<drawStyle type="photo" /> // Options: photo, painting, sketch, etc.
0.0.2
4 months ago