slidecanvas 1.0.6 → 1.0.8

package/README.md

@@ -10,6 +10,9 @@
 - **AI-Powered Editing**: Integrated Gemini AI for smart text manipulation (Shorten, Reframe, Lengthen) with side-by-side controls.
 - **Enterprise-Grade Parsing**: Deep internal processing of XML-based PPTX structures.
 - **Professional Ribbon UI**: A high-density, Microsoft Office-style toolbar layout (120px height) with optimized visibility for all controls.
+- **Slash Commands (`/`)**: A fast, context-aware command menu triggered by typing `/` anywhere on the canvas or in a text box.
+- **AI-Powered Image Generation**: Integrated flow for generating design assets via optional `onGenerateImage` hook, with built-in preview and replacement logic.
+- **AI Suggestion Box**: A side-by-side text refinement UI for reviewing Shorten/Reframe/Lengthen suggestions before applying them.
 - **Smart Actions Group**: Prominent buttons for Present, Export (PPTX), and Delete, with a subtle "Saved" status indicator.
 - **Professional Export**: High-quality `.pptx` generation with support for transparency and layout mapping.
 - **S3 & Remote Support**: Built-in architecture for loading presentations via secure proxy tunnels.
@@ -103,9 +106,31 @@ export async function GET(request: NextRequest) {
 > [!IMPORTANT]
 > To use the custom proxy above, pass its path to the `proxyUrl` prop in the `PptEditor` component (e.g., `<PptEditor proxyUrl="/api/proxy" ... />`).
 
-### 3. Enabling AI Features
+### 4. Slash Commands & AI design
+SlideCanvas features a powerful Slash Command system. Type `/` at any time to:
+- **Insert Elements**: Instantly add Text, Images, or Shapes.
+- **AI Actions**: Trigger text transformations or **AI Image Generation** directly at your cursor.
 
-SlideCanvas comes battery-included with Gemini AI support. To enable smart text actions (Shorten, Reframe, Lengthen), simply pass your Gemini API key to the component:
+---
+
+### 5. Custom AI Image Generation
+You can integrate your own AI image provider (e.g., DALL-E, Midjourney, or a custom S3-backed service) by passing the `onGenerateImage` prop:
+
+```tsx
+<PptEditor 
+  onGenerateImage={async (prompt) => {
+    const response = await fetch('/api/my-ai', { body: JSON.stringify({ prompt }) });
+    const data = await response.json();
+    return data.s3ImageUrl; // Return a URL string
+  }}
+/>
+```
+
+> [!TIP]
+> When an image is generated, SlideCanvas provides a professional **Preview Modal** allowing users to **Insert** as new, **Replace** a selected image (preserving dimensions), or **Discard**.
+
+### 6. Enabling AI Text Refinement
+SlideCanvas comes battery-included with Gemini AI support for text.
 
 ```tsx
 import { PptEditor } from 'slidecanvas';
@@ -256,6 +281,8 @@ async function extractCaptions(fileBuffer: ArrayBuffer) {
 | `appName` | `string` | `"SlideCanvas"` | Brand name shown in the ribbon. |
 | `appBgColor` | `string` | `"#B7472A"` | Primary brand color for the UI. |
 | `geminiApiKey` | `string` | `undefined` | API key for built-in AI text actions. |
+| `onGenerateImage` | `(prompt: string) => Promise<string>` | `undefined` | Custom hook to handle AI image generation. |
+| `proxyUrl` | `string` | `undefined` | Base path for the proxy API (used for PPTX loading and image previews). |
 | `showHomeOnEmpty` | `boolean` | `false` | Shows a "New / Upload" splash if no data provided. |
 | `onChange` | `(pres: Presentation) => void` | `undefined` | Fired on any change to the deck. |
 | `onSourceChange` | `(src, url?) => void` | `undefined` | Fired when the deck origin changes (useful for routing). |

package/dist/index.d.mts

@@ -61,6 +61,7 @@ interface PptEditorProps {
     initialSource?: PresentationSource;
     onSourceChange?: (source: PresentationSource, url?: string) => void;
     proxyUrl?: string;
+    onGenerateImage?: (prompt: string) => Promise<string>;
 }
 declare const PptEditor: React.FC<PptEditorProps>;
 

package/dist/index.d.ts

@@ -61,6 +61,7 @@ interface PptEditorProps {
     initialSource?: PresentationSource;
     onSourceChange?: (source: PresentationSource, url?: string) => void;
     proxyUrl?: string;
+    onGenerateImage?: (prompt: string) => Promise<string>;
 }
 declare const PptEditor: React.FC<PptEditorProps>;