@orangecatai/element 0.0.2 → 0.0.3

package/dist/types/excalidraw/components/AIChatPanel.d.ts

@@ -0,0 +1,114 @@
+import React from "react";
+import { type ToolAction } from "./ai-chat/agentLoop";
+import "./AIChatPanel.scss";
+import type { ReviewerFeedback } from "./ai-chat/reviewerAgent";
+import type { ExcalidrawImperativeAPI } from "../types";
+export type ChatMessage = {
+    id: string;
+    role: "user" | "assistant";
+    content: string;
+    timestamp: Date;
+    toolActions?: ToolAction[];
+    attachments?: Array<{
+        name: string;
+        type: "image" | "text";
+        dataUrl?: string;
+    }>;
+    /** Reviewer feedback attached to an assistant message after HTML ad generation */
+    reviewFeedback?: ReviewerFeedback;
+};
+export type ChatSession = {
+    id: string;
+    title: string;
+    messages: ChatMessage[];
+};
+export type AIChatPanelRef = {
+    setMessages: (messages: ChatMessage[], sessionId?: string) => void;
+    send: (text: string) => void;
+};
+export type AIChatPanelProps = {
+    isOpen: boolean;
+    onClose: () => void;
+    apiKey?: string;
+    excalidrawAPI?: ExcalidrawImperativeAPI;
+    geminiApiKey?: string;
+    initialMessages?: ChatMessage[];
+    initialSessionId?: string;
+    initialSessions?: ChatSession[];
+    onMessagesChange?: (messages: ChatMessage[], sessionId: string) => void;
+    onSessionCreate?: (session: {
+        id: string;
+        title: string;
+    }) => void;
+    onSessionSwitch?: (sessionId: string) => void;
+    onBeforeSend?: (ctx: {
+        hasVoice: boolean;
+    }) => Promise<{
+        allowed: boolean;
+        error?: string;
+    }>;
+    onAfterSend?: (ctx: {
+        hasVoice: boolean;
+    }) => void;
+    onBeforeImageGen?: () => Promise<{
+        allowed: boolean;
+        error?: string;
+    }>;
+    onAfterImageGen?: () => void;
+    /**
+     * OpenRouter model tag for the chat system (both plain chat and agent loop).
+     * @default "google/gemini-3.1-flash-lite-preview"
+     * @example "openai/gpt-4o" or "anthropic/claude-sonnet-4"
+     */
+    chatModel?: string;
+    /**
+     * OpenRouter model tag for voice/speech-to-text transcription.
+     * @default "mistralai/voxtral-small-24b-2507"
+     */
+    voiceModel?: string;
+    /**
+     * Gemini model ID used by the agent's generate_image tool.
+     * @default "gemini-3.1-flash-image-preview"
+     * @example "gemini-2.0-flash-preview-image-generation"
+     */
+    agentImageModel?: string;
+    /**
+     * Optional brand identity context. When provided, the AI agent receives
+     * the brand's colors, typography, tone of voice, and imagery direction as
+     * a system-level context message so it can create on-brand ads.
+     *
+     * Pair this with `customFonts` on `<Excalidraw>` so that any uploaded
+     * brand font files are also registered in the canvas.
+     */
+    brandContext?: import("../types").BrandContext;
+    onSearchBrandAssets?: (query: string, type?: string) => Promise<Array<{
+        id: string;
+        name: string;
+        tags: string[];
+        assetType: string;
+        blobUrl: string;
+    }>>;
+    onListBrandTemplates?: (keywords?: string[]) => Promise<Array<{
+        id: string;
+        name: string;
+        campaignTag?: string;
+        label?: string;
+        width?: number;
+        height?: number;
+        thumbnailBlobUrl?: string;
+    }>>;
+    onGetTemplateVariant?: (variantId: string) => Promise<{
+        canvasJson: string;
+    }>;
+    /**
+     * OpenRouter model tag for the reviewer agent. Must be vision-capable.
+     * Defaults to the same model as chatModel.
+     */
+    reviewerModel?: string;
+    /**
+     * Maximum number of reviewer rounds per banner before the reviewer is skipped.
+     * @default 2
+     */
+    maxReviewRounds?: number;
+};
+export declare const AIChatPanel: React.ForwardRefExoticComponent<AIChatPanelProps & React.RefAttributes<AIChatPanelRef>>;

package/dist/types/excalidraw/components/Actions.d.ts

@@ -30,6 +30,9 @@ export declare const ShapesSwitcher: ({ activeTool, setAppState, app, UIOptions,
     app: AppClassProperties;
     UIOptions: AppProps["UIOptions"];
 }) => import("react/jsx-runtime").JSX.Element;
+export declare const ScrollBackToContentAction: ({ renderAction, }: {
+    renderAction: ActionManager["renderAction"];
+}) => import("react/jsx-runtime").JSX.Element | null;
 export declare const ZoomActions: ({ renderAction, zoom, }: {
     renderAction: ActionManager["renderAction"];
     zoom: Zoom;

package/dist/types/excalidraw/components/CanvasBackgroundSwatch.d.ts

@@ -0,0 +1,7 @@
+import "./CanvasBackgroundSwatch.scss";
+import type { ActionManager } from "../actions/manager";
+import type { UIAppState } from "../types";
+export declare const CanvasBackgroundSwatch: ({ actionManager, appState, }: {
+    actionManager: ActionManager;
+    appState: UIAppState;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/types/excalidraw/components/ColorPicker/AdvancedColorPicker.d.ts

@@ -0,0 +1,8 @@
+import "./AdvancedColorPicker.scss";
+interface AdvancedColorPickerProps {
+    color: string;
+    onChange: (color: string) => void;
+    showAlpha?: boolean;
+}
+export declare const AdvancedColorPicker: ({ color, onChange, showAlpha, }: AdvancedColorPickerProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/excalidraw/components/ColorPicker/colorConversions.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Pure color conversion utilities for HSV ↔ RGB ↔ Hex with alpha support.
+ */
+export interface HSVA {
+    h: number;
+    s: number;
+    v: number;
+    a: number;
+}
+export interface RGBA {
+    r: number;
+    g: number;
+    b: number;
+    a: number;
+}
+export declare const hsvaToRgba: ({ h, s, v, a }: HSVA) => RGBA;
+export declare const rgbaToHsva: ({ r, g, b, a }: RGBA) => HSVA;
+export declare const rgbaToHex: ({ r, g, b, a }: RGBA) => string;
+export declare const hexToRgba: (hex: string) => RGBA;
+export declare const hsvaToHex: (hsva: HSVA) => string;
+export declare const hexToHsva: (hex: string) => HSVA;
+/** Produces a CSS-safe rgba() string */
+export declare const hsvaToRgbaString: (hsva: HSVA) => string;
+/**
+ * Clamp a number between min and max.
+ */
+export declare const clampValue: (value: number, min: number, max: number) => number;

package/dist/types/excalidraw/components/DarkModeToggle.d.ts

@@ -1,5 +1,5 @@
-import type { Theme } from "@orangecatai/element/types";
 import "./ToolIcon.scss";
+import type { Theme } from "@orangecatai/element/types";
 export declare const DarkModeToggle: (props: {
     value: Theme;
     onChange: (value: Theme) => void;

package/dist/types/excalidraw/components/DefaultSidebar.d.ts

@@ -4,7 +4,7 @@ import type { SidebarProps, SidebarTriggerProps } from "./Sidebar/common";
 export declare const DefaultSidebar: import("react").FC<Omit<MarkOptional<Omit<{
     name: import("../types").SidebarName;
     children: React.ReactNode;
-    onStateChange?: (state: import("../types").AppState["openSidebar"]) => void;
+    onStateChange?: (state: import("..").AppState["openSidebar"]) => void;
     onDock?: (docked: boolean) => void;
     docked?: boolean;
     className?: string;

package/dist/types/excalidraw/components/ElementCanvasButtons.d.ts

@@ -1,5 +1,5 @@
-import type { ElementsMap, NonDeletedExcalidrawElement } from "@orangecatai/element/types";
 import "./ElementCanvasButtons.scss";
+import type { ElementsMap, NonDeletedExcalidrawElement } from "@orangecatai/element/types";
 export declare const ElementCanvasButtons: ({ children, element, elementsMap, }: {
     children: React.ReactNode;
     element: NonDeletedExcalidrawElement;

package/dist/types/excalidraw/components/FrameToolbar.d.ts

@@ -1,5 +1,5 @@
-import type { ExcalidrawFrameLikeElement, NonDeletedExcalidrawElement } from "@orangecatai/element/types";
 import "./FrameToolbar.scss";
+import type { ExcalidrawFrameLikeElement, NonDeletedExcalidrawElement } from "@orangecatai/element/types";
 import type { AppClassProperties } from "../types";
 export declare const FrameToolbar: ({ element, app, }: {
     element: NonDeletedExcalidrawElement & ExcalidrawFrameLikeElement;

package/dist/types/excalidraw/components/HintViewer.d.ts

@@ -1,5 +1,5 @@
-import type { EditorInterface } from "@orangecatai/common";
 import "./HintViewer.scss";
+import type { EditorInterface } from "@orangecatai/common";
 import type { AppClassProperties, UIAppState } from "../types";
 interface HintViewerProps {
     appState: UIAppState;

package/dist/types/excalidraw/components/ImageEditToolbar.d.ts

@@ -0,0 +1,16 @@
+import "./ImageEditToolbar.scss";
+import type { ExcalidrawImageElement, NonDeletedExcalidrawElement } from "@orangecatai/element/types";
+import type { AppClassProperties } from "../types";
+export interface ImageEditToolbarCallbacks {
+    onQuickEdit?: () => void;
+    onUpscale?: () => void;
+    onRemoveBG?: () => void;
+    onCrop?: () => void;
+    onDownload?: () => void;
+    onSwapAsset?: (elementId: string) => Promise<void>;
+}
+export declare const ImageEditToolbar: ({ element, app, callbacks, }: {
+    element: ExcalidrawImageElement & NonDeletedExcalidrawElement;
+    app: AppClassProperties;
+    callbacks?: ImageEditToolbarCallbacks;
+}) => import("react/jsx-runtime").JSX.Element | null;

package/dist/types/excalidraw/components/ImageGeneratorPanel.d.ts

@@ -3,21 +3,21 @@ import type { ExcalidrawFrameLikeElement, NonDeletedExcalidrawElement } from "@o
 import type { AppClassProperties } from "../types";
 export declare const MODEL_CONFIG: {
     readonly "Gemini 2.5 Flash": {
-        readonly geminiModelId: "gemini-2.5-flash-image";
+        readonly geminiModelId: "gemini-3.1-flash-image";
         readonly supportsImageSize: false;
         readonly supportsThinking: false;
         readonly supportedResolutions: readonly ["1K"];
         readonly supportedRatios: readonly ["21:9", "16:9", "4:3", "3:2", "1:1", "9:16", "3:4", "2:3", "5:4", "4:5"];
     };
     readonly "Gemini 3.1 Flash": {
-        readonly geminiModelId: "gemini-3.1-flash-image-preview";
+        readonly geminiModelId: "gemini-3.1-flash-image";
         readonly supportsImageSize: true;
         readonly supportsThinking: true;
         readonly supportedResolutions: readonly ["0.5K", "1K", "2K", "4K"];
         readonly supportedRatios: readonly ["21:9", "16:9", "4:3", "3:2", "1:1", "9:16", "3:4", "2:3", "5:4", "4:5", "4:1", "1:4", "8:1", "1:8"];
     };
     readonly "Gemini 3 Pro": {
-        readonly geminiModelId: "gemini-3-pro-image-preview";
+        readonly geminiModelId: "gemini-3-pro-image";
         readonly supportsImageSize: true;
         readonly supportsThinking: false;
         readonly supportedResolutions: readonly ["1K", "2K", "4K"];
@@ -32,7 +32,12 @@ export declare function getDimensions(model: ModelName, ratio: string, resolutio
     height: number;
 };
 export declare function callGeminiAPI(prompt: string, modelId: string, aspectRatio: string, resolution: Resolution, supportsImageSize: boolean, supportsThinking: boolean, apiKey: string, referenceImageDataUrl?: string, signal?: AbortSignal): Promise<string>;
-export declare const ImageGeneratorPanel: ({ element, app, }: {
+export declare const ImageGeneratorPanel: ({ element, app, onBeforeImageGen, onAfterImageGen, }: {
     element: NonDeletedExcalidrawElement & ExcalidrawFrameLikeElement;
     app: AppClassProperties;
+    onBeforeImageGen?: () => Promise<{
+        allowed: boolean;
+        error?: string;
+    }>;
+    onAfterImageGen?: () => void;
 }) => import("react/jsx-runtime").JSX.Element | null;

package/dist/types/excalidraw/components/ImageQuickEditPanel.d.ts

@@ -1,7 +1,16 @@
 import "./ImageQuickEditPanel.scss";
 import type { ExcalidrawImageElement, NonDeletedExcalidrawElement } from "@orangecatai/element/types";
 import type { AppClassProperties } from "../types";
-export declare const ImageQuickEditPanel: ({ element, app, }: {
+export declare const ImageQuickEditPanel: ({ element, app, onBeforeImageGen, onAfterImageGen, forceOpen, onClose, }: {
     element: ExcalidrawImageElement & NonDeletedExcalidrawElement;
     app: AppClassProperties;
+    onBeforeImageGen?: () => Promise<{
+        allowed: boolean;
+        error?: string;
+    }>;
+    onAfterImageGen?: () => void;
+    /** When true, skip the trigger bar and render the panel directly. */
+    forceOpen?: boolean;
+    /** Called when the panel closes itself (only used when forceOpen=true). */
+    onClose?: () => void;
 }) => import("react/jsx-runtime").JSX.Element | null;

package/dist/types/excalidraw/components/Sidebar/Sidebar.d.ts

@@ -14,7 +14,7 @@ export declare const isSidebarDockedAtom: import("jotai/vanilla/atom").Primitive
 export declare const SidebarInner: React.ForwardRefExoticComponent<Omit<{
     name: import("../../types").SidebarName;
     children: React.ReactNode;
-    onStateChange?: (state: import("../../types").AppState["openSidebar"]) => void;
+    onStateChange?: (state: import("../..").AppState["openSidebar"]) => void;
     onDock?: (docked: boolean) => void;
     docked?: boolean;
     className?: string;
@@ -23,7 +23,7 @@ export declare const SidebarInner: React.ForwardRefExoticComponent<Omit<{
 export declare const Sidebar: React.ForwardRefExoticComponent<{
     name: import("../../types").SidebarName;
     children: React.ReactNode;
-    onStateChange?: (state: import("../../types").AppState["openSidebar"]) => void;
+    onStateChange?: (state: import("../..").AppState["openSidebar"]) => void;
     onDock?: (docked: boolean) => void;
     docked?: boolean;
     className?: string;

package/dist/types/excalidraw/components/Stats/DragInput.d.ts

@@ -1,6 +1,6 @@
-import type { Scene } from "@orangecatai/element";
 import { useApp, useExcalidrawSetAppState } from "../App";
 import "./DragInput.scss";
+import type { Scene } from "@orangecatai/element";
 import type { ElementsMap, ExcalidrawElement } from "@orangecatai/element/types";
 import type { StatsInputProperty } from "./utils";
 import type { AppState } from "../../types";

package/dist/types/excalidraw/components/Stats/index.d.ts

@@ -1,5 +1,5 @@
-import type { NonDeletedExcalidrawElement } from "@orangecatai/element/types";
 import "./Stats.scss";
+import type { NonDeletedExcalidrawElement } from "@orangecatai/element/types";
 import type { AppClassProperties, AppState, ExcalidrawProps } from "../../types";
 interface StatsProps {
     app: AppClassProperties;

package/dist/types/excalidraw/components/TTDDialog/utils/TTDStreamFetch.d.ts

@@ -20,5 +20,6 @@ export type StreamChunk = {
         status?: number;
     };
 };
+export declare function parseSSEStream(reader: ReadableStreamDefaultReader<Uint8Array>): AsyncGenerator<string, void, unknown>;
 export declare function TTDStreamFetch(options: StreamingOptions): Promise<TTTDDialog.OnTextSubmitRetValue>;
 export {};

package/dist/types/excalidraw/components/ToolButton.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import type { PointerType } from "@orangecatai/element/types";
 import "./ToolIcon.scss";
+import type { PointerType } from "@orangecatai/element/types";
 import type { CSSProperties } from "react";
 export type ToolButtonSize = "small" | "medium";
 type ToolButtonBaseProps = {

package/dist/types/excalidraw/components/ai-chat/agentLoop.d.ts

@@ -0,0 +1,112 @@
+import { type ToolExecutionContext } from "./canvasTools";
+import type { BrandContext } from "../../types";
+type ContentPart = {
+    type: "text";
+    text: string;
+} | {
+    type: "image_url";
+    image_url: {
+        url: string;
+    };
+};
+export type AgentMessage = {
+    role: "system";
+    content: string;
+} | {
+    role: "user";
+    content: string | ContentPart[];
+} | {
+    role: "assistant";
+    content: string | null;
+    tool_calls?: ToolCall[];
+} | {
+    role: "tool";
+    tool_call_id: string;
+    content: string;
+};
+export type ToolCall = {
+    id: string;
+    type: "function";
+    function: {
+        name: string;
+        arguments: string;
+    };
+};
+export type ToolAction = {
+    result: {
+        success: boolean;
+        statusMessage: string;
+    };
+};
+export type AgentUpdate = {
+    type: "status" | "tool_start" | "tool_done" | "final" | "content_delta";
+    message: string;
+    toolAction?: ToolAction;
+} | {
+    type: "review_start";
+    message: string;
+} | {
+    type: "review_done";
+    message: string;
+    feedback: import("./reviewerAgent").ReviewerFeedback;
+};
+export type AgentResult = {
+    reply: string;
+    toolActions: ToolAction[];
+};
+/**
+ * Converts a BrandContext object to a concise system message string.
+ */
+export declare function buildBrandContextMessage(ctx: BrandContext): string;
+export type FileAttachment = {
+    name: string;
+    type: "image" | "text";
+    dataUrl?: string;
+    textContent?: string;
+};
+export declare function runAgentLoop(opts: {
+    userMessages: Array<{
+        role: "user" | "assistant";
+        content: string;
+        /** Images attached to THIS specific message (from the user's upload history) */
+        imageAttachments?: Array<{
+            name: string;
+            dataUrl: string;
+        }>;
+    }>;
+    elementContext?: string;
+    frameScreenshot?: string;
+    fileAttachments?: FileAttachment[];
+    webSearchEnabled?: boolean;
+    apiKey: string;
+    chatModel?: string;
+    agentImageModel?: string;
+    toolCtx: ToolExecutionContext;
+    onUpdate: (update: AgentUpdate) => void;
+    signal?: AbortSignal;
+    onBeforeImageGen?: () => Promise<{
+        allowed: boolean;
+        error?: string;
+    }>;
+    onAfterImageGen?: () => void;
+    /** Optional brand identity context — injected as a system message before user messages. */
+    brandContext?: BrandContext;
+    /**
+     * @deprecated Font IDs are now derived from brandContext.typography.fontFamilyId.
+     * Kept for API compatibility but no longer used internally.
+     */
+    customFontIds?: number[];
+    /**
+     * OpenRouter model tag for the reviewer agent. Must be vision-capable.
+     * Defaults to the same model as chatModel.
+     */
+    reviewerModel?: string;
+    /**
+     * Maximum number of reviewer rounds per banner.
+     * After this many rounds the reviewer is skipped and the outer MAX_ITERATIONS
+     * cap handles loop termination.
+     * @default 2
+     */
+    maxReviewRounds?: number;
+}): Promise<AgentResult>;
+export {};

package/dist/types/excalidraw/components/ai-chat/audioUtils.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Converts any audio Blob (webm, mp4, ogg…) to a base64-encoded WAV string
+ * using the Web Audio API. Mistral Voxtral only accepts mp3 or wav.
+ */
+export declare function blobToWavBase64(blob: Blob): Promise<string>;
+/**
+ * Sends a base64-encoded audio string to the OpenRouter Voxtral model for
+ * transcription. `format` must be "wav" or "mp3".
+ */
+export declare function transcribeAudio(base64Audio: string, format: string, apiKey: string, voiceModel?: string): Promise<string>;