@innovastudio/contentbox 1.6.194 → 1.6.196

package/index.d.ts

@@ -1,3 +1,21 @@
+/** An entry in the font picker. Only fontFamily is required. */
+interface FontEntry {
+    /** What appears in the picker. Defaults to the first name in fontFamily. */
+    label?: string;
+    /** The font-family applied to the text. */
+    fontFamily: string;
+    /**
+     * Stylesheet that defines the font: your own @font-face file, a Google
+     * Fonts URL, or any other. Omit for fonts already installed on the device.
+     */
+    cssUrl?: string;
+    /** Searched and matched on. Defaults to the first name in fontFamily. */
+    value?: string;
+    fontStyle?: string;
+    fontDisplay?: string;
+    provider?: '' | 'google' | 'others';
+}
+
 interface ContentBoxOptions {
     wrapper?: string;
     siteToken?: string;
@@ -19,10 +37,31 @@ interface ContentBoxOptions {
     disableStaticSection?: boolean;
     framework?: string;
     imageRenameOnEdit?: boolean;
+    /** @deprecated 'crop' opens the older crop-only dialog. It will be removed. */
+    imageEditor?: string;
+    /** LUT library for the image editor's look reel: entries, { category: entries }, or a URL to a JSON file. */
+    imageEditorPresets?: string | any[] | Record<string, any[]> | null;
+    /** Encoder quality (0-1) used when the image editor saves. Default 0.92. */
+    imageEditorQuality?: number;
+    /** Show the image editor's "My looks" section (save & re-apply a treatment). Default false. */
+    imageEditorMyLooks?: boolean;
+    /** Show the image editor's "Load .cube…" button (load a LUT from the user's computer). Default false. */
+    imageEditorLoadCube?: boolean;
     imageResizeOnBlock?: boolean;
 
     htmlButton?: boolean;
+    sectionHtmlButton?: boolean;
     undoRedoButtons?: boolean;
+    /** Content Size slider on the Box panel. Default: true. */
+    contentSizeSlider?: boolean;
+    /** Drag handles on the page for resizing the content width. Default: true. */
+    contentResizeHandles?: boolean;
+    /** Superscript & subscript buttons on the Text panel. Default: false. */
+    subscriptSuperscript?: boolean;
+    /** Insert Symbol button on the Text panel. Default: false. */
+    symbols?: boolean;
+    /** Search & Replace button on the Text panel. Default: false. */
+    searchReplace?: boolean;
     toggleDeviceButton?: boolean;
     deviceButtons?: boolean;
 
@@ -57,6 +96,23 @@ interface ContentBoxOptions {
     contentStylePath?: string;
     pluginPath?: string;
     fontAssetPath?: string;
+    fontPath?: string;
+
+    /** Replaces the built-in font list of the Text panel's font picker. */
+    fonts?: FontEntry[] | null;
+    /** Adds fonts to the font list. Use this for fonts your users upload. */
+    customFonts?: FontEntry[];
+    /**
+     * How the font picker shows each font: drawn in the font itself ('font',
+     * the default), the thumbnails shipped in fontAssetPath ('image', which
+     * needs no internet connection), or plain text ('none').
+     */
+    fontPreview?: 'font' | 'image' | 'none';
+    /**
+     * Where 'font' previews are fetched from. Defaults to Google's CSS2
+     * endpoint; any Google Fonts compatible service works.
+     */
+    fontPreviewUrl?: string;
 
     disableBootstrapIcons?: boolean;
 
@@ -124,6 +180,9 @@ interface ContentBoxOptions {
     slider?: string;
     navbar?: boolean;
     screenMode?: string;
+    scaleFullview?: boolean;
+    fullviewLogicalWidth?: number;
+    disableAutoOpenEditPanel?: boolean;
 
     onRender?: () => void;
     onChange?: () => void;
@@ -216,6 +275,13 @@ interface ContentBoxOptions {
     toolbar?: string;
     toolbarDisplay?: string;
     toolbarAddSnippetButton?: boolean;
+    /** Paste mode. 
+     * 'auto' (default): content adopts the destination block,
+     *  keeping semantic inline marks (bold/italic/underline/strike/link/code/
+     *  sub-sup) and dropping presentational styling
+     * 'text': plain text. 
+     * 'html': HTML with styles. 
+     * 'html-without-styles': HTML, inline styles dropped, classes kept. */
     paste?: string;
     builderMode?: string;
     
@@ -330,8 +396,48 @@ interface ContentBoxOptions {
     clearChatSettings?: boolean;
     defaultChatSettings?: Record<string, any>;
     demoMode?: boolean;
-    demoConversations?: any[]; 
+    demoConversations?: any[];
     startCodeChat?: boolean;
+    /**
+     * AI framework-context inclusion for code generation (Code Chat):
+     * - 'all'       — send every framework (content + box + animation + design) on each code request
+     * - 'selection' — send only the frameworks a task needs (drops box/animation/design/content when not required)
+     * - 'optimized' — selection + finer drops (also drops the Buttons block from the content docs when no button)
+     * @default 'optimized'
+     */
+    context?: 'all' | 'selection' | 'optimized';
+    /**
+     * Include the optional Motion Path animation context (`data-fx-path`) — moving
+     * an object along a curved path through waypoints. A rare, story-page effect,
+     * so it's off by default; when on, it rides along wherever the animation
+     * framework is included in an AI code request.
+     * @default false
+     */
+    motionPath?: boolean;
+
+    //-- Code Chat: vision / attachments
+    /** Let files be attached to a chat message. Off by default: the attach
+     *  button is hidden and drag-and-drop and paste are not accepted. */
+    chatAttachments?: boolean;
+    /** Legacy attachment handling: extract text from Office/text files and
+     *  transcode images before sending, instead of passing files through
+     *  natively. Off by default. */
+    convertAttachments?: boolean;
+    /** Explicit override of which code models accept image input. When omitted,
+     *  capability comes from a model entry's own `accepts` list, then family
+     *  heuristics. */
+    visionCapableCodeModels?: string[];
+    /** Same as visionCapableCodeModels, for the chat model list. */
+    visionCapableChatModels?: string[];
+    /** Per-provider image model lists. Only the active provider's list is used,
+     *  and the provider suffix is matched case-insensitively. An entry is
+     *  `{ id, label, sizes?, size_param?, output_format?, output_param?,
+     *  size_auto?, image_input?, edit? }`; a Fal entry adds
+     *  `edit: { id, image_param, image_max?, ...overrides }` naming the model id
+     *  used when reference images ride along. */
+    imageModels_Fal?: any[];
+    imageModels_OpenRouter?: any[];
+    imageModels_OpenAI?: any[];
 
     //-- Asset Manager
     listFilesUrl?: string;
@@ -377,6 +483,21 @@ interface ContentBoxOptions {
     generateMediaUrl_Fal?: string;
     checkRequestStatusUrl_Fal?: string;
     getResultUrl_Fal?: string;
+    /** OpenRouter image provider (defaultImageGenerationProvider: 'openrouter').
+     *  Same three-step request/status/result contract as the _Fal endpoints,
+     *  including reference-image features (restyle / edit existing photos),
+     *  which all three providers serve. */
+    generateMediaUrl_OpenRouter?: string;
+    checkRequestStatusUrl_OpenRouter?: string;
+    getResultUrl_OpenRouter?: string;
+    /** OpenAI image provider (defaultImageGenerationProvider: 'openai').
+     *  The same three-step request/status/result contract as the _Fal and
+     *  _OpenRouter endpoints, including reference-image features (an entry with
+     *  image_input: true routes to /v1/images/edits). Distinct from the older
+     *  one-shot generateMediaUrl_OpenAI_CreateImage(Edit) below. */
+    generateMediaUrl_OpenAI?: string;
+    checkRequestStatusUrl_OpenAI?: string;
+    getResultUrl_OpenAI?: string;
     minimizeImageUrl?: string;
     cleanup?: string;
     generateMediaUrl_OpenAI_CreateImage?: string;
@@ -427,19 +548,143 @@ interface InlineScriptOptions {
     retryDelay?: number;
 }
 
+/** Options for builder.modal(). Only `html` is required. */
+interface ModalOptions {
+    /** Title bar text. Omit for a bare dialog with a floating close button. */
+    title?: string;
+    /** The content of the dialog: plain markup, no shell needed. */
+    html: string;
+    /** 320 (px) or any CSS length, e.g. '40rem'. */
+    width?: number | string;
+    /** Overrides the body padding. Skipped automatically if your own outermost
+     *  element already sets padding inline. */
+    padding?: string;
+    /** Default: true. */
+    closeButton?: boolean;
+    /** Default: true. Applies to the title bar. */
+    draggable?: boolean;
+    /** Extra class on the shell, so you can style it from your own CSS. */
+    className?: string;
+    overlayStay?: boolean;
+    onOpen?: (modal: ModalHandle) => void;
+    onClose?: (modal: ModalHandle) => void;
+}
+
+/** What builder.modal() returns. */
+interface ModalHandle {
+    /** The dialog element. */
+    el: HTMLElement;
+    /** The content wrapper - query your own markup from here. */
+    body: HTMLElement;
+    open(): ModalHandle;
+    close(): ModalHandle;
+}
+
 declare class ContentBox {
     constructor(options: ContentBoxOptions);
 
     boxImage(url: string, err?: string): void;
     selectAsset(url: string): void;
+    /**
+     * Show a file: images and video open in the editor's lightbox, anything
+     * else (pdf, audio, archives) opens in a new tab. Also available inside a
+     * page opened by the editor as window.parent.previewAsset(url).
+     */
+    previewAsset(url: string): void;
     hideModal(modal?: HTMLElement): void;
+
+    /**
+     * Build a dialog from plain content. The shell, title bar, close button,
+     * aria attributes, padding and drag wiring are supplied for you:
+     *
+     *     const wc = builder.modal({ title: 'Word Count', width: 320, html: '<div>…</div>' });
+     *     wc.open();
+     */
+    modal(options: ModalOptions): ModalHandle;
+
+    /**
+     * Page Preview. Opens previewURL in a fullscreen frame with a width ruler,
+     * so a layout can be checked at any width without leaving the editor.
+     * Does nothing when previewURL is unset.
+     *
+     * Distinct from openPreview(), which opens Live Preview, the small floating
+     * window. Both remain available.
+     */
+    openPagePreview(): void;
+
+    /* Building a feature from outside: add your own button and back it with a
+       real dialog, without reaching into the editor. */
+
+    /** Insert markup into the editor's own container (#_cbhtml), so .is-modal
+     *  and friends style it exactly as they style the built-in dialogs. */
+    addHtml(html: string): void;
+    /** Append a stylesheet to the host page's <head>. */
+    addCss(css: string): void;
+    /** Insert the modal if needed, show it, and make its .is-draggable bar drag. */
+    createModal(
+        modal: HTMLElement,
+        selector: string,
+        overlayStay?: boolean,
+        cancelCallback?: () => void,
+        animated?: boolean,
+        overflowHidden?: boolean
+    ): HTMLElement;
+    showModal(
+        modal: HTMLElement,
+        overlayStay?: boolean,
+        cancelCallback?: () => void,
+        animated?: boolean,
+        overflowHidden?: boolean
+    ): void;
+    /** Make anything matching the selector draggable by that element. */
+    draggable(selector: string): void;
+    showSidePanel(panel: HTMLElement): void;
+    hideSidePanel(panel: HTMLElement): void;
+    /** Record an undo point before your code changes content, so your edit is
+     *  one step of the editor's undo history. */
+    saveForUndo(checkLater?: boolean): void;
+    /** Insert HTML at the caret, the way the built-in insert tools do. */
+    pasteHtmlAtCaret(html: string, selectPastedContent?: boolean): void;
+    getScriptPath(): string;
+
     closeAsset(): void;
     returnUrl(s: string): void;
     htmlCheck(): void;
     loadHtml(html: string): void;
     loadStyles(mainCss: string, sectionCss: string): void;
     addButton(btn: object): void;
+    /** Adds a font to the font picker after the editor has been created. */
+    addFont(font: FontEntry): void;
+    /** Adds a button to the Text panel of the control panel (not the sidebar — see addButton). */
+    addTextButton(
+        html: string,
+        selector?: string,
+        exec?: (e: Event) => void
+    ): HTMLElement | null;
+    /** Wraps the current text selection in an inline plugin instance. */
+    convertSelectionToPlugin(
+        pluginName: string,
+        config?: {
+            create?: (selectedText: string, doc: Document) => HTMLElement;
+            attributes?: Record<string, string>;
+            className?: string;
+            tag?: string;
+            openEditor?: boolean;
+        }
+    ): HTMLElement | null;
+    /** Toggles a highlight (marker) background on the current text selection. */
+    toggleHighlight(color?: string): void;
+    /** Shows or hides the superscript/subscript buttons on the Text panel. */
+    setSubscriptSuperscript(show?: boolean): void;
+    /** Translates a string through the active language file. */
+    out(text: string, alt?: string): string;
+    /** Opens the Motion cascade for the selected section. */
+    openMotionCascade(): void;
+    /** Opens the Motion dock and timeline. */
+    openMotionDock(): void;
+    /** Legacy animation panel, replaced by openMotionCascade(). */
     openAnimationPanel(): void;
+    /** Legacy timeline editor, replaced by openMotionDock(). */
     openAnimationTimeline(): void;
     openAIAssistant(): void;
     openSettings(e: object): void;

package/package.json

@@ -1,7 +1,7 @@
 {
-  "name": "@innovastudio/contentbox",
   "type": "module",
-  "version": "1.6.194",
+  "name": "@innovastudio/contentbox",
+  "version": "1.6.196",
   "description": "",
   "main": "public/contentbox/contentbox.esm.js",
   "types": "index.d.ts",
@@ -14,7 +14,15 @@
     "serve": "webpack serve --config webpack.config.js",
     "start": "concurrently \"node server.js\" \"webpack serve --config webpack.config.js\"",
     "scss": "sass --watch --no-source-map src/scss/contentbox.scss public/contentbox/contentbox.css",
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test:fullview": "node tests/fullview-regression.mjs",
+    "test:box": "node tests/box-structure.mjs",
+    "test:contentsize": "node tests/content-size-handles.mjs",
+    "test:spacing": "node tests/spacing-panels.mjs",
+    "test:panelsection": "node tests/panel-section-state.mjs",
+    "test:devicerow": "node tests/device-row.mjs",
+    "test:canvas": "node tests/canvas-size.mjs",
+    "test:fonts": "node tests/fonts.mjs",
+    "test": "node tests/box-structure.mjs && node tests/content-size-handles.mjs && node tests/spacing-panels.mjs && node tests/panel-section-state.mjs && node tests/device-row.mjs && node tests/canvas-size.mjs && node tests/fonts.mjs"
   },
   "keywords": [],
   "author": "",
@@ -59,7 +67,7 @@
     "ws": "^8.13.0"
   },
   "dependencies": {
-    "@innovastudio/contentbuilder": "^1.5.211",
+    "@innovastudio/contentbuilder": "^1.5.214",
     "js-beautify": "^1.14.0",
     "marked": "^17.0.0",
     "sortablejs": "^1.15.2"