@orangecatai/element 0.0.2 → 0.0.3

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

@@ -430,6 +430,80 @@ export type OnUserFollowedPayload = {
     userToFollow: UserToFollow;
     action: "FOLLOW" | "UNFOLLOW";
 };
+/**
+ * Describes a custom font to register in the canvas font system.
+ * Use family IDs >= 2000 to avoid collision with built-in fonts.
+ * IDs up to 1000 are reserved (1–10 named fonts, 100 CJK, 998/999 generic, 1000 emoji).
+ */
+export type CustomFontSpec = {
+    /** Unique numeric family ID. Use 2000+ to avoid collisions with built-ins. */
+    familyId: number;
+    /** CSS font-family name used in @font-face and canvas rendering. */
+    name: string;
+    /** Absolute URL or data: URL pointing to the font file. */
+    url: string;
+    /**
+     * Informational font-weight (e.g. "400", "700"). Not applied as a CSS
+     * descriptor — getFontString never includes weight, so all custom fonts
+     * load as the normal-weight variant for their family ID.
+     */
+    weight?: string;
+};
+/**
+ * Optional brand identity context passed to AIChatPanel.
+ * When provided, the AI agent uses these guidelines when creating ads.
+ */
+export type BrandContext = {
+    colors?: {
+        primary?: string;
+        secondary?: string;
+        accent?: string;
+        background?: string;
+    };
+    typography?: {
+        headline?: {
+            family: string;
+            weight?: string;
+            /** size_scale from brand kit (e.g. "display", "large", "medium", "small") */
+            sizeScale?: string;
+            /**
+             * Font family ID if a matching custom font was registered via
+             * the `customFonts` prop on <Excalidraw>. The agent will pass
+             * this number to add_text fontFamily calls.
+             */
+            fontFamilyId?: number;
+            /** Original font file name from brand DNA (e.g. "Avenir-Heavy.otf"). Passed to AI for image generation context. */
+            fontName?: string;
+        };
+        body?: {
+            family: string;
+            weight?: string;
+            sizeScale?: string;
+            fontFamilyId?: number;
+            /** Original font file name from brand DNA. */
+            fontName?: string;
+        };
+    };
+    visualStyle?: string;
+    layoutPattern?: string;
+    toneOfVoice?: {
+        register?: string;
+        vocabulary?: string;
+        ctaStyle?: string;
+        sentenceLength?: string;
+        person?: string;
+    };
+    imagery?: {
+        type?: string;
+        lighting?: string;
+        composition?: string;
+        subjects?: string;
+        grading?: string;
+        depthOfField?: string;
+        environment?: string;
+        negativeSpace?: string;
+    };
+};
 export interface ExcalidrawProps {
     onChange?: (elements: readonly OrderedExcalidrawElement[], appState: AppState, files: BinaryFiles) => void;
     onIncrement?: (event: DurableIncrement | EphemeralIncrement) => void;
@@ -497,6 +571,149 @@ export interface ExcalidrawProps {
      * Required for image generation when using this package as an npm dependency.
      */
     geminiApiKey?: string;
+    /**
+     * Leonardo API key for image toolbar upscale action.
+     * When provided, takes precedence over the VITE_APP_LEONARDO_API_KEY env variable.
+     */
+    leonardoApiKey?: string;
+    /**
+     * OpenRouter API key for auto-resize layout planning.
+     * When provided, takes precedence over the VITE_APP_OPEN_ROUTER_API_KEY env variable.
+     */
+    openRouterApiKey?: string;
+    /**
+     * remove.bg API key for the remove background toolbar action.
+     * When provided, takes precedence over the VITE_APP_REMOVE_BG_API_KEY env variable.
+     */
+    removeBgApiKey?: string;
+    /**
+     * Called before any image generation (ImageGeneratorPanel, ImageQuickEditPanel,
+     * or agent loop generate_image tool). Return `{ allowed: false }` to block.
+     * Host apps use this for credit gating.
+     */
+    onBeforeImageGen?: () => Promise<{
+        allowed: boolean;
+        error?: string;
+    }>;
+    /**
+     * Called after a successful image generation from any panel or agent tool.
+     */
+    onAfterImageGen?: () => void;
+    /**
+     * Called before an upscale is run (deduct credits, check quota).
+     * Return `{ allowed: false, error: "..." }` to block the operation.
+     */
+    onBeforeUpscale?: () => Promise<{
+        allowed: boolean;
+        error?: string;
+    }>;
+    /** Called after a successful upscale. */
+    onAfterUpscale?: () => void;
+    /**
+     * Called before a background removal is run (deduct credits, check quota).
+     * Return `{ allowed: false, error: "..." }` to block the operation.
+     */
+    onBeforeRemoveBg?: () => Promise<{
+        allowed: boolean;
+        error?: string;
+    }>;
+    /** Called after a successful background removal. */
+    onAfterRemoveBg?: () => void;
+    /**
+     * Called before each auto-resize dimension is generated (deduct credits, check quota).
+     * Return `{ allowed: false, error: "..." }` to skip that dimension.
+     */
+    onBeforeAutoResize?: () => Promise<{
+        allowed: boolean;
+        error?: string;
+    }>;
+    /** Called after each successfully generated auto-resize dimension. */
+    onAfterAutoResize?: () => void;
+    /**
+     * Gemini model ID used for AI image generation — covers both the auto-resize
+     * background regeneration and the agent chat `generate_image` tool.
+     * Pass the same value here and to `AIChatPanel.agentImageModel` to keep
+     * both surfaces on the same model with a single configuration.
+     * @default "gemini-3.1-flash-image-preview"
+     * @example "gemini-3.1-flash-image-preview"
+     */
+    agentImageModel?: string;
+    /**
+     * OpenRouter model tag used by the auto-resize engine for HTML layout
+     * generation. This is the LLM call that figures out how to reflow the ad
+     * content into the target dimensions before Gemini regenerates the background.
+     * @default "google/gemini-3.1-flash-lite-preview"
+     * @example "openai/gpt-4o"
+     */
+    chatModel?: string;
+    /**
+     * Show the Library sidebar trigger button. Defaults to `false`.
+     * Set to `true` to show the library icon in the top-right area.
+     */
+    showLibraryButton?: boolean;
+    /**
+     * Callbacks for each action in the image edit toolbar
+     * (shown when an image element is selected on canvas).
+     * When callbacks are omitted, built-in toolbar actions are used.
+     */
+    imageEditToolbarCallbacks?: import("./components/ImageEditToolbar").ImageEditToolbarCallbacks;
+    /**
+     * Custom fonts to register in the canvas font system.
+     * Each entry maps a numeric family ID (use 2000+) to a font file URL.
+     * Registered fonts become available for text elements whose fontFamily
+     * matches the given familyId.
+     */
+    customFonts?: CustomFontSpec[];
+    /**
+     * Called when the user saves a template from the Template Builder.
+     */
+    onSaveTemplate?: (template: {
+        name: string;
+        campaignTag?: string;
+        label?: string;
+        width?: number;
+        height?: number;
+        canvasJson?: string;
+        thumbnailDataUrl?: string;
+    }) => void;
+    /**
+     * Fetch all available brand assets for the asset picker (in-canvas swap).
+     */
+    onFetchAllAssets?: () => Promise<Array<{
+        id: string;
+        name: string;
+        tags: string[];
+        assetType: string;
+        blobUrl: string;
+    }>>;
+    /**
+     * Search brand assets by query and optional type filter.
+     */
+    onSearchBrandAssets?: (query: string, type?: string) => Promise<Array<{
+        id: string;
+        name: string;
+        tags: string[];
+        assetType: string;
+        blobUrl: string;
+    }>>;
+    /**
+     * List brand templates, optionally filtered by campaignTag.
+     */
+    onListBrandTemplates?: (keywords?: string[]) => Promise<Array<{
+        id: string;
+        name: string;
+        campaignTag?: string;
+        label?: string;
+        width?: number;
+        height?: number;
+        thumbnailBlobUrl?: string;
+    }>>;
+    /**
+     * Fetch the full canvas JSON for a specific template by ID.
+     */
+    onGetTemplateVariant?: (templateId: string) => Promise<{
+        canvasJson: string;
+    }>;
 }
 export type SceneData = {
     elements?: ImportedDataState["elements"];
@@ -517,6 +734,7 @@ export type CanvasActions = Partial<{
     saveToActiveFile: boolean;
     toggleTheme: boolean | null;
     saveAsImage: boolean;
+    scrollBackToContent: boolean;
 }>;
 export type UIOptions = Partial<{
     dockedSidebarBreakpoint: number;
@@ -549,6 +767,7 @@ export type AppProps = Merge<ExcalidrawProps, {
 export type AppClassProperties = {
     props: AppProps;
     state: AppState;
+    actionManager: App["actionManager"];
     interactiveCanvas: HTMLCanvasElement | null;
     /** static canvas */
     canvas: HTMLCanvasElement;
@@ -590,6 +809,7 @@ export type AppClassProperties = {
     visibleElements: App["visibleElements"];
     excalidrawContainerValue: App["excalidrawContainerValue"];
     getSceneElements: App["getSceneElements"];
+    updateScene: App["updateScene"];
     onPointerUpEmitter: App["onPointerUpEmitter"];
     updateEditorAtom: App["updateEditorAtom"];
     onPointerDownEmitter: App["onPointerDownEmitter"];

package/dist/types/excalidraw/utils/leonardoApiKey.d.ts

@@ -0,0 +1 @@
+export declare function resolveLeonardoApiKey(propKey?: string): string;

package/dist/types/excalidraw/utils/openRouterApiKey.d.ts

@@ -0,0 +1 @@
+export declare function resolveOpenRouterApiKey(propKey?: string): string;

package/dist/types/excalidraw/utils/removeBgApiKey.d.ts

@@ -0,0 +1 @@
+export declare function resolveRemoveBgApiKey(propKey?: string): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orangecatai/element",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "type": "module",
   "types": "./dist/types/element/src/index.d.ts",
   "main": "./dist/prod/index.js",
@@ -63,7 +63,7 @@
     "build:esm": "rimraf dist && node ../../scripts/buildBase.js && yarn gen:types"
   },
   "dependencies": {
-    "@orangecatai/common": "0.0.2",
+    "@orangecatai/common": "0.0.3",
     "@orangecatai/math": "0.0.2"
   }
 }