@promptbook/components 0.112.0-59 → 0.112.0-61

package/esm/index.es.js

@@ -40,7 +40,7 @@ const BOOK_LANGUAGE_VERSION = '2.0.0';
  * @generated
  * @see https://github.com/webgptorg/promptbook
  */
-const PROMPTBOOK_ENGINE_VERSION = '0.112.0-59';
+const PROMPTBOOK_ENGINE_VERSION = '0.112.0-61';
 /**
  * TODO: string_promptbook_version should be constrained to the all versions of Promptbook engine
  * Note: [💞] Ignore a discrepancy between file name and entity name
@@ -23561,6 +23561,241 @@ function useBookEditorMonacoDiagnostics({ editor, monaco, diagnostics }) {
     }, [diagnostics, editor, monaco]);
 }
 
+/**
+ * Clipboard MIME types treated as rich text documents for upload.
+ *
+ * @private function of BookEditorMonaco
+ */
+const RICH_CLIPBOARD_TEXT_MIME_TYPES = new Set(['text/html', 'text/rtf']);
+/**
+ * Uploaded filename mapping for known rich clipboard MIME types.
+ *
+ * @private function of BookEditorMonaco
+ */
+const CLIPBOARD_RICH_CONTENT_FILENAMES = {
+    'text/html': 'clipboard-content.html',
+    'text/rtf': 'clipboard-content.rtf',
+    'application/rtf': 'clipboard-content.rtf',
+};
+/**
+ * Fallback filename used when clipboard MIME type is unknown.
+ *
+ * @private function of BookEditorMonaco
+ */
+const DEFAULT_CLIPBOARD_RICH_CONTENT_FILENAME = 'clipboard-content.txt';
+/**
+ * Maximum pointer travel still treated as a tap on the touch focus overlay.
+ *
+ * @private function of BookEditorMonaco
+ */
+const TOUCH_TAP_THRESHOLD = 10;
+/**
+ * Lists transferable items from a browser `DataTransfer` object.
+ *
+ * @private function of BookEditorMonaco
+ */
+function listDataTransferItems(dataTransfer) {
+    const items = [];
+    for (let index = 0; index < dataTransfer.items.length; index++) {
+        const item = dataTransfer.items[index];
+        if (item) {
+            items.push(item);
+        }
+    }
+    return items;
+}
+/**
+ * Removes duplicate files by using stable file metadata signature.
+ *
+ * @private function of BookEditorMonaco
+ */
+function deduplicateFiles(files) {
+    const uniqueFiles = new Map();
+    for (const file of files) {
+        uniqueFiles.set(`${file.name}:${file.type}:${file.size}`, file);
+    }
+    return Array.from(uniqueFiles.values());
+}
+/**
+ * Extracts all file-like clipboard/drop payloads from a `DataTransfer`.
+ *
+ * @private function of BookEditorMonaco
+ */
+function getDataTransferFiles(dataTransfer) {
+    const directFiles = Array.from(dataTransfer.files || []);
+    const itemFiles = listDataTransferItems(dataTransfer)
+        .filter((item) => item.kind === 'file')
+        .map((item) => item.getAsFile())
+        .filter((file) => file !== null);
+    return deduplicateFiles([...directFiles, ...itemFiles]);
+}
+/**
+ * Picks the richest textual clipboard item that should be uploaded as a document.
+ *
+ * @private function of BookEditorMonaco
+ */
+function getRichClipboardTextItem(dataTransfer) {
+    const items = listDataTransferItems(dataTransfer);
+    const hasPlainTextItem = items.some((item) => item.kind === 'string' && item.type.toLowerCase() === 'text/plain');
+    const applicationItem = items.find((item) => item.kind === 'string' && item.type.toLowerCase().startsWith('application/'));
+    if (applicationItem) {
+        return applicationItem;
+    }
+    if (hasPlainTextItem) {
+        return null;
+    }
+    const richTextItem = items.find((item) => {
+        if (item.kind !== 'string') {
+            return false;
+        }
+        return RICH_CLIPBOARD_TEXT_MIME_TYPES.has(item.type.toLowerCase());
+    });
+    return richTextItem || null;
+}
+/**
+ * Resolves whether paste should route into upload workflow instead of text insert.
+ *
+ * @private function of BookEditorMonaco
+ */
+function hasUploadableClipboardContent(dataTransfer) {
+    if (getDataTransferFiles(dataTransfer).length > 0) {
+        return true;
+    }
+    return getRichClipboardTextItem(dataTransfer) !== null;
+}
+/**
+ * Reads string payload from clipboard item.
+ *
+ * @private function of BookEditorMonaco
+ */
+function getClipboardItemString(item) {
+    return new Promise((resolve) => {
+        try {
+            item.getAsString((value) => resolve(value || ''));
+        }
+        catch (_a) {
+            resolve('');
+        }
+    });
+}
+/**
+ * Determines filename for generated clipboard rich-content uploads.
+ *
+ * @private function of BookEditorMonaco
+ */
+function getClipboardRichContentFilename(mimeType) {
+    return CLIPBOARD_RICH_CONTENT_FILENAMES[mimeType.toLowerCase()] || DEFAULT_CLIPBOARD_RICH_CONTENT_FILENAME;
+}
+/**
+ * Converts clipboard payload into upload-ready files.
+ *
+ * @private function of BookEditorMonaco
+ */
+async function resolveClipboardUploadFiles(dataTransfer) {
+    const files = getDataTransferFiles(dataTransfer);
+    if (files.length > 0) {
+        return files;
+    }
+    const richTextItem = getRichClipboardTextItem(dataTransfer);
+    if (!richTextItem) {
+        return [];
+    }
+    const content = await getClipboardItemString(richTextItem);
+    const mimeType = richTextItem.type || 'text/plain';
+    if (!content.trim()) {
+        return [];
+    }
+    return [new File([content], getClipboardRichContentFilename(mimeType), { type: mimeType })];
+}
+/**
+ * Manages drag, paste and file input interactions for `BookEditorMonaco`.
+ *
+ * @private function of BookEditorMonaco
+ */
+function useBookEditorMonacoInteractions({ editor, handleFiles, }) {
+    const [isDragOver, setIsDragOver] = useState(false);
+    const touchStartRef = useRef(null);
+    const fileUploadInputRef = useRef(null);
+    const cameraInputRef = useRef(null);
+    const handleDrop = useCallback(async (event) => {
+        event.preventDefault();
+        setIsDragOver(false);
+        const files = getDataTransferFiles(event.dataTransfer);
+        await handleFiles(files);
+    }, [handleFiles]);
+    const handlePaste = useCallback(async (event) => {
+        const clipboardData = event.clipboardData;
+        if (!hasUploadableClipboardContent(clipboardData)) {
+            return;
+        }
+        event.preventDefault();
+        event.stopPropagation();
+        const files = await resolveClipboardUploadFiles(clipboardData);
+        await handleFiles(files);
+    }, [handleFiles]);
+    const handleUploadDocument = useCallback(() => {
+        var _a;
+        (_a = fileUploadInputRef.current) === null || _a === void 0 ? void 0 : _a.click();
+    }, []);
+    const handleTakePhoto = useCallback(() => {
+        var _a;
+        (_a = cameraInputRef.current) === null || _a === void 0 ? void 0 : _a.click();
+    }, []);
+    const handleFileInputChange = useCallback((event) => {
+        const files = Array.from(event.target.files || []);
+        void handleFiles(files);
+        event.target.value = '';
+    }, [handleFiles]);
+    const handleDragOver = useCallback((event) => {
+        event.preventDefault();
+        setIsDragOver(true);
+    }, []);
+    const handleDragEnter = useCallback((event) => {
+        event.preventDefault();
+        setIsDragOver(true);
+    }, []);
+    const handleDragLeave = useCallback((event) => {
+        event.preventDefault();
+        setIsDragOver(false);
+    }, []);
+    const handleFocusOverlayTouchStart = useCallback((event) => {
+        const touch = event.touches[0];
+        if (touch) {
+            touchStartRef.current = { x: touch.clientX, y: touch.clientY };
+        }
+    }, []);
+    const handleFocusOverlayTouchEnd = useCallback((event) => {
+        event.preventDefault();
+        const touch = event.changedTouches[0];
+        if (touch && touchStartRef.current) {
+            const deltaX = Math.abs(touch.clientX - touchStartRef.current.x);
+            const deltaY = Math.abs(touch.clientY - touchStartRef.current.y);
+            if (deltaX < TOUCH_TAP_THRESHOLD && deltaY < TOUCH_TAP_THRESHOLD) {
+                editor === null || editor === void 0 ? void 0 : editor.focus();
+            }
+        }
+        touchStartRef.current = null;
+    }, [editor]);
+    const focusOverlayTouchHandlers = useMemo(() => ({
+        onTouchStart: handleFocusOverlayTouchStart,
+        onTouchEnd: handleFocusOverlayTouchEnd,
+    }), [handleFocusOverlayTouchEnd, handleFocusOverlayTouchStart]);
+    return {
+        isDragOver,
+        fileUploadInputRef,
+        cameraInputRef,
+        handleDrop,
+        handlePaste,
+        handleUploadDocument,
+        handleTakePhoto,
+        handleFileInputChange,
+        handleDragOver,
+        handleDragEnter,
+        handleDragLeave,
+        focusOverlayTouchHandlers,
+    };
+}
+
 /**
  * Priority order for the important commitments shown first in catalogues and intellisense.
  *
@@ -24223,6 +24458,181 @@ function useBookEditorMonacoLanguage({ monaco, theme }) {
     }, [monaco, theme]);
 }
 
+/**
+ * Local storage key that enables BookEditor Monaco lifecycle debug logs in development.
+ *
+ * @private function of BookEditorMonaco
+ */
+const BOOK_EDITOR_MONACO_DEBUG_STORAGE_KEY = 'promptbook-debug-book-editor-monaco';
+/**
+ * Duration of the save notification.
+ *
+ * @private function of BookEditorMonaco
+ */
+const SAVE_NOTIFICATION_HIDE_DELAY_MS = 2000;
+/**
+ * Resolves whether verbose BookEditor Monaco lifecycle logs are enabled.
+ *
+ * @private function of BookEditorMonaco
+ */
+function isBookEditorMonacoDebugEnabled() {
+    if (process.env.NODE_ENV === 'production' || typeof window === 'undefined') {
+        return false;
+    }
+    try {
+        return window.localStorage.getItem(BOOK_EDITOR_MONACO_DEBUG_STORAGE_KEY) === '1';
+    }
+    catch (_a) {
+        return false;
+    }
+}
+/**
+ * Prints one BookEditor Monaco debug line when the dev debug flag is enabled.
+ *
+ * @param message - Human-readable lifecycle message.
+ *
+ * @private function of BookEditorMonaco
+ */
+function logBookEditorMonacoDebug(message) {
+    if (!isBookEditorMonacoDebugEnabled()) {
+        return;
+    }
+    console.info(`[BookEditorMonaco] ${message}`);
+}
+/**
+ * Detects whether the current device primarily uses a coarse pointer.
+ *
+ * @private function of BookEditorMonaco
+ */
+function detectIsTouchDevice() {
+    if (typeof window === 'undefined') {
+        return false;
+    }
+    return window.matchMedia('(pointer: coarse)').matches;
+}
+/**
+ * Manages Monaco lifecycle wiring for `BookEditorMonaco`.
+ *
+ * @private function of BookEditorMonaco
+ */
+function useBookEditorMonacoLifecycle({ monaco, theme, }) {
+    const [editor, setEditor] = useState(null);
+    const [isFocused, setIsFocused] = useState(false);
+    const [isTouchDevice, setIsTouchDevice] = useState(false);
+    const [isSavedShown, setIsSavedShown] = useState(false);
+    /**
+     * Re-applies Book language + theme to the currently mounted Monaco model.
+     */
+    const reapplyBookLanguageAndTheme = useCallback((reason) => {
+        if (!editor || !monaco) {
+            return;
+        }
+        ensureBookEditorMonacoLanguageForEditor({ monaco, monacoEditor: editor, theme });
+        logBookEditorMonacoDebug(`Re-applied Book Monaco language/theme (${reason}).`);
+    }, [editor, monaco, theme]);
+    /**
+     * Re-triggers the transient save toast without preventing the browser save dialog.
+     */
+    const showSavedNotification = useCallback(() => {
+        setIsSavedShown(false);
+        setTimeout(() => setIsSavedShown(true), 0);
+    }, []);
+    useEffect(() => {
+        setIsTouchDevice(detectIsTouchDevice());
+    }, []);
+    useEffect(() => {
+        if (!editor || !monaco) {
+            return;
+        }
+        const focusListener = editor.onDidFocusEditorWidget(() => {
+            setIsFocused(true);
+            reapplyBookLanguageAndTheme('focus');
+        });
+        const blurListener = editor.onDidBlurEditorWidget(() => {
+            setIsFocused(false);
+        });
+        const saveAction = editor.addAction({
+            id: 'save-book',
+            label: 'Save',
+            keybindings: [monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyS],
+            run: () => {
+                showSavedNotification();
+                // Note: We don't prevent default, so browser's save dialog still opens
+            },
+        });
+        return () => {
+            focusListener.dispose();
+            blurListener.dispose();
+            saveAction.dispose();
+        };
+    }, [editor, monaco, reapplyBookLanguageAndTheme, showSavedNotification]);
+    useEffect(() => {
+        reapplyBookLanguageAndTheme('editor-ready');
+    }, [reapplyBookLanguageAndTheme]);
+    useEffect(() => {
+        if (!editor || !monaco) {
+            return;
+        }
+        const handlePopState = () => {
+            reapplyBookLanguageAndTheme('history-popstate');
+        };
+        const handlePageShow = () => {
+            reapplyBookLanguageAndTheme('pageshow');
+        };
+        const handleWindowFocus = () => {
+            reapplyBookLanguageAndTheme('window-focus');
+        };
+        const handleVisibilityChange = () => {
+            if (document.visibilityState === 'visible') {
+                reapplyBookLanguageAndTheme('visibility-visible');
+            }
+        };
+        window.addEventListener('popstate', handlePopState);
+        window.addEventListener('pageshow', handlePageShow);
+        window.addEventListener('focus', handleWindowFocus);
+        document.addEventListener('visibilitychange', handleVisibilityChange);
+        return () => {
+            window.removeEventListener('popstate', handlePopState);
+            window.removeEventListener('pageshow', handlePageShow);
+            window.removeEventListener('focus', handleWindowFocus);
+            document.removeEventListener('visibilitychange', handleVisibilityChange);
+        };
+    }, [editor, monaco, reapplyBookLanguageAndTheme]);
+    useEffect(() => {
+        if (!isSavedShown) {
+            return;
+        }
+        const timer = setTimeout(() => {
+            setIsSavedShown(false);
+        }, SAVE_NOTIFICATION_HIDE_DELAY_MS);
+        return () => {
+            clearTimeout(timer);
+        };
+    }, [isSavedShown]);
+    /**
+     * Ensures Book language/tokenizer is ready before Monaco creates the editor model.
+     */
+    const handleBeforeMonacoMount = useCallback((beforeMountMonaco) => {
+        ensureBookEditorMonacoLanguage(beforeMountMonaco, theme);
+    }, [theme]);
+    /**
+     * Re-applies Book language/theme once Monaco editor is mounted.
+     */
+    const handleMonacoMount = useCallback((mountedEditor, mountedMonaco) => {
+        setEditor(mountedEditor);
+        ensureBookEditorMonacoLanguageForEditor({ monaco: mountedMonaco, monacoEditor: mountedEditor, theme });
+        logBookEditorMonacoDebug('Mounted Monaco editor and re-applied Book language/theme.');
+    }, [theme]);
+    return {
+        editor,
+        isFocused,
+        isTouchDevice,
+        isSavedShown,
+        handleBeforeMonacoMount,
+        handleMonacoMount,
+    };
+}
+
 /**
  * Relative Y offset multiplier for aligning line background with Monaco rendering.
  *
@@ -25032,190 +25442,101 @@ function BookEditorMonacoUploadPanel({ activeUploadItems, uploadStats, pauseUplo
  */
 const INVALID_CSS_IDENTIFIER_CHARACTER_PATTERN = /[^a-zA-Z0-9_-]/g;
 /**
- * Clipboard MIME types treated as rich text documents for upload.
+ * Base Book editor font size before zoom scaling.
  *
  * @private Internal utility of `BookEditorMonaco`.
  */
-const RICH_CLIPBOARD_TEXT_MIME_TYPES = new Set(['text/html', 'text/rtf']);
+const BASE_FONT_SIZE = 20;
 /**
- * Uploaded filename mapping for known rich clipboard MIME types.
+ * Minimum supported Book editor font size after zoom scaling.
  *
  * @private Internal utility of `BookEditorMonaco`.
  */
-const CLIPBOARD_RICH_CONTENT_FILENAMES = {
-    'text/html': 'clipboard-content.html',
-    'text/rtf': 'clipboard-content.rtf',
-    'application/rtf': 'clipboard-content.rtf',
-};
+const MIN_FONT_SIZE = 8;
 /**
- * Fallback filename used when clipboard MIME type is unknown.
- *
- * @private Internal utility of `BookEditorMonaco`.
- */
-const DEFAULT_CLIPBOARD_RICH_CONTENT_FILENAME = 'clipboard-content.txt';
-/**
- * Local storage key that enables BookEditor Monaco lifecycle debug logs in development.
- *
- * @private Internal utility of `BookEditorMonaco`.
- */
-const BOOK_EDITOR_MONACO_DEBUG_STORAGE_KEY = 'promptbook-debug-book-editor-monaco';
-/**
- * Resolves whether verbose BookEditor Monaco lifecycle logs are enabled.
+ * Default Monaco scrollbar size before zoom scaling.
  *
  * @private Internal utility of `BookEditorMonaco`.
  */
-function isBookEditorMonacoDebugEnabled() {
-    if (process.env.NODE_ENV === 'production' || typeof window === 'undefined') {
-        return false;
-    }
-    try {
-        return window.localStorage.getItem(BOOK_EDITOR_MONACO_DEBUG_STORAGE_KEY) === '1';
-    }
-    catch (_a) {
-        return false;
-    }
-}
-/**
- * Prints one BookEditor Monaco debug line when the dev debug flag is enabled.
- *
- * @param message - Human-readable lifecycle message.
- *
- * @private Internal utility of `BookEditorMonaco`.
- */
-function logBookEditorMonacoDebug(message) {
-    if (!isBookEditorMonacoDebugEnabled()) {
-        return;
-    }
-    console.info(`[BookEditorMonaco] ${message}`);
-}
-/**
- * Lists transferable items from a browser `DataTransfer` object.
- *
- * @private Internal utility of `BookEditorMonaco`.
- */
-function listDataTransferItems(dataTransfer) {
-    const items = [];
-    for (let index = 0; index < dataTransfer.items.length; index++) {
-        const item = dataTransfer.items[index];
-        if (item) {
-            items.push(item);
-        }
-    }
-    return items;
-}
-/**
- * Removes duplicate files by using stable file metadata signature.
- *
- * @private Internal utility of `BookEditorMonaco`.
- */
-function deduplicateFiles(files) {
-    const uniqueFiles = new Map();
-    for (const file of files) {
-        uniqueFiles.set(`${file.name}:${file.type}:${file.size}`, file);
-    }
-    return Array.from(uniqueFiles.values());
-}
-/**
- * Extracts all file-like clipboard/drop payloads from a `DataTransfer`.
- *
- * @private Internal utility of `BookEditorMonaco`.
- */
-function getDataTransferFiles(dataTransfer) {
-    const directFiles = Array.from(dataTransfer.files || []);
-    const itemFiles = listDataTransferItems(dataTransfer)
-        .filter((item) => item.kind === 'file')
-        .map((item) => item.getAsFile())
-        .filter((file) => file !== null);
-    return deduplicateFiles([...directFiles, ...itemFiles]);
-}
+const BASE_SCROLLBAR_SIZE = 5;
 /**
- * Picks the richest textual clipboard item that should be uploaded as a document.
+ * Minimum Monaco scrollbar size after zoom scaling.
  *
  * @private Internal utility of `BookEditorMonaco`.
  */
-function getRichClipboardTextItem(dataTransfer) {
-    const items = listDataTransferItems(dataTransfer);
-    const hasPlainTextItem = items.some((item) => item.kind === 'string' && item.type.toLowerCase() === 'text/plain');
-    const applicationItem = items.find((item) => item.kind === 'string' && item.type.toLowerCase().startsWith('application/'));
-    if (applicationItem) {
-        return applicationItem;
-    }
-    if (hasPlainTextItem) {
-        return null;
-    }
-    const richTextItem = items.find((item) => {
-        if (item.kind !== 'string') {
-            return false;
-        }
-        return RICH_CLIPBOARD_TEXT_MIME_TYPES.has(item.type.toLowerCase());
-    });
-    if (richTextItem) {
-        return richTextItem;
-    }
-    return null;
-}
+const MIN_SCROLLBAR_SIZE = 2;
 /**
- * Resolves whether paste should route into upload workflow instead of text insert.
+ * Minimum left padding Monaco reserves for custom line decorations.
  *
  * @private Internal utility of `BookEditorMonaco`.
  */
-function hasUploadableClipboardContent(dataTransfer) {
-    if (getDataTransferFiles(dataTransfer).length > 0) {
-        return true;
-    }
-    return getRichClipboardTextItem(dataTransfer) !== null;
-}
+const MIN_CONTENT_PADDING_LEFT = 8;
 /**
- * Reads string payload from clipboard item.
+ * Creates a hydration-stable CSS class name from React's `useId()` value.
  *
  * @private Internal utility of `BookEditorMonaco`.
  */
-function getClipboardItemString(item) {
-    return new Promise((resolve) => {
-        try {
-            item.getAsString((value) => resolve(value || ''));
-        }
-        catch (_a) {
-            resolve('');
-        }
-    });
+function createStableBookEditorInstanceClassName(reactId) {
+    return `book-editor-instance-${reactId.replace(INVALID_CSS_IDENTIFIER_CHARACTER_PATTERN, '-')}`;
 }
 /**
- * Determines filename for generated clipboard rich-content uploads.
+ * Resolves Monaco layout values from the active Book editor zoom level.
  *
  * @private Internal utility of `BookEditorMonaco`.
  */
-function getClipboardRichContentFilename(mimeType) {
-    return CLIPBOARD_RICH_CONTENT_FILENAMES[mimeType.toLowerCase()] || DEFAULT_CLIPBOARD_RICH_CONTENT_FILENAME;
+function createBookEditorMonacoScale(zoomLevel) {
+    return {
+        scaledLineHeight: Math.round(BookEditorMonacoConstants.LINE_HEIGHT * zoomLevel),
+        scaledContentPaddingLeft: Math.max(MIN_CONTENT_PADDING_LEFT, Math.round(BookEditorMonacoConstants.CONTENT_PADDING_LEFT * zoomLevel)),
+        scaledVerticalLineLeft: Math.max(0, Math.round(BookEditorMonacoConstants.VERTICAL_LINE_LEFT * zoomLevel)),
+        scaledFontSize: Math.max(MIN_FONT_SIZE, Math.round(BASE_FONT_SIZE * zoomLevel)),
+        scaledScrollbarSize: Math.max(MIN_SCROLLBAR_SIZE, Math.round(BASE_SCROLLBAR_SIZE * zoomLevel)),
+    };
 }
 /**
- * Creates a hydration-stable CSS class name from React's `useId()` value.
+ * Determines whether the Book editor action bar should be shown.
  *
  * @private Internal utility of `BookEditorMonaco`.
  */
-function createStableBookEditorInstanceClassName(reactId) {
-    return `book-editor-instance-${reactId.replace(INVALID_CSS_IDENTIFIER_CHARACTER_PATTERN, '-')}`;
+function isBookEditorMonacoActionbarVisible({ hoistedMenuItems, isUploadButtonShown, isCameraButtonShown, isDownloadButtonShown, isAboutButtonShown, isFullscreenButtonShown, }) {
+    return (Boolean(hoistedMenuItems && hoistedMenuItems.length > 0) ||
+        Boolean(isUploadButtonShown) ||
+        Boolean(isCameraButtonShown) ||
+        Boolean(isDownloadButtonShown) ||
+        Boolean(isAboutButtonShown) ||
+        Boolean(isFullscreenButtonShown));
 }
 /**
- * Converts clipboard payload into upload-ready files.
+ * Builds the Monaco editor options consumed by `MonacoEditorWithShadowDom`.
  *
  * @private Internal utility of `BookEditorMonaco`.
  */
-async function resolveClipboardUploadFiles(dataTransfer) {
-    const files = getDataTransferFiles(dataTransfer);
-    if (files.length > 0) {
-        return files;
-    }
-    const richTextItem = getRichClipboardTextItem(dataTransfer);
-    if (!richTextItem) {
-        return [];
-    }
-    const content = await getClipboardItemString(richTextItem);
-    const mimeType = richTextItem.type || 'text/plain';
-    if (!content.trim()) {
-        return [];
-    }
-    return [new File([content], getClipboardRichContentFilename(mimeType), { type: mimeType })];
+function createBookEditorMonacoOptions({ isReadonly, translations, scaledFontSize, scaledLineHeight, scaledContentPaddingLeft, scaledScrollbarSize, }) {
+    return {
+        readOnly: isReadonly,
+        readOnlyMessage: {
+            value: (translations === null || translations === void 0 ? void 0 : translations.readonlyMessage) || 'You cannot edit this book',
+        },
+        wordWrap: 'on',
+        minimap: { enabled: false },
+        lineNumbers: 'off',
+        fontSize: scaledFontSize,
+        fontFamily: `"Playfair Display", serif`,
+        lineHeight: scaledLineHeight,
+        renderLineHighlight: 'none',
+        lineDecorationsWidth: scaledContentPaddingLeft,
+        glyphMargin: false,
+        folding: false,
+        lineNumbersMinChars: 0,
+        links: true,
+        scrollbar: {
+            vertical: 'auto',
+            horizontal: 'hidden',
+            verticalScrollbarSize: scaledScrollbarSize,
+            arrowSize: 0,
+            useShadows: false,
+        },
+    };
 }
 /**
  * Handles book editor monaco.
@@ -25225,29 +25546,40 @@ async function resolveClipboardUploadFiles(dataTransfer) {
 function BookEditorMonaco(props) {
     const { value, onChange, diagnostics, isReadonly, theme = 'LIGHT', translations, onFileUpload, isUploadButtonShown, isCameraButtonShown, isDownloadButtonShown, isAboutButtonShown = true, isFullscreenButtonShown = true, onFullscreenClick, isFullscreen, zoom = 1, monacoModelPath, hoistedMenuItems, } = props;
     const zoomLevel = zoom;
-    const scaledLineHeight = Math.round(BookEditorMonacoConstants.LINE_HEIGHT * zoomLevel);
-    const scaledContentPaddingLeft = Math.max(8, Math.round(BookEditorMonacoConstants.CONTENT_PADDING_LEFT * zoomLevel));
-    const scaledVerticalLineLeft = Math.max(0, Math.round(BookEditorMonacoConstants.VERTICAL_LINE_LEFT * zoomLevel));
-    const baseFontSize = 20;
-    const scaledFontSize = Math.max(8, Math.round(baseFontSize * zoomLevel));
-    const scaledScrollbarSize = Math.max(2, Math.round(5 * zoomLevel));
-    const [isDragOver, setIsDragOver] = useState(false);
-    const [editor, setEditor] = useState(null);
-    const [isFocused, setIsFocused] = useState(false);
-    const [isTouchDevice, setIsTouchDevice] = useState(false);
-    const [isSavedShown, setIsSavedShown] = useState(false);
+    const { scaledLineHeight, scaledContentPaddingLeft, scaledVerticalLineLeft, scaledFontSize, scaledScrollbarSize } = createBookEditorMonacoScale(zoomLevel);
     const monaco = useMonaco();
     const reactId = useId();
     const instanceClass = createStableBookEditorInstanceClassName(reactId);
-    const touchStartRef = useRef(null);
-    const fileUploadInputRef = useRef(null);
-    const cameraInputRef = useRef(null);
+    const { editor, isFocused, isTouchDevice, isSavedShown, handleBeforeMonacoMount, handleMonacoMount } = useBookEditorMonacoLifecycle({
+        monaco,
+        theme,
+    });
     const { activeUploadItems, uploadStats, pauseUpload, resumeUpload, handleFiles } = useBookEditorMonacoUploads({
         editor,
         monaco,
         onFileUpload,
     });
+    const { isDragOver, fileUploadInputRef, cameraInputRef, handleDrop, handlePaste, handleUploadDocument, handleTakePhoto, handleFileInputChange, handleDragOver, handleDragEnter, handleDragLeave, focusOverlayTouchHandlers, } = useBookEditorMonacoInteractions({
+        editor,
+        handleFiles,
+    });
     const combinedDiagnostics = [...(diagnostics || []), ...createDeprecatedCommitmentDiagnostics(value)];
+    const isActionBarVisible = isBookEditorMonacoActionbarVisible({
+        hoistedMenuItems,
+        isUploadButtonShown,
+        isCameraButtonShown,
+        isDownloadButtonShown,
+        isAboutButtonShown,
+        isFullscreenButtonShown,
+    });
+    const monacoOptions = createBookEditorMonacoOptions({
+        isReadonly,
+        translations,
+        scaledFontSize,
+        scaledLineHeight,
+        scaledContentPaddingLeft,
+        scaledScrollbarSize,
+    });
     useBookEditorMonacoLanguage({ monaco, theme });
     useBookEditorMonacoDiagnostics({ monaco, editor, diagnostics: combinedDiagnostics });
     useBookEditorMonacoDecorations({ editor, monaco });
@@ -25259,171 +25591,6 @@ function BookEditorMonaco(props) {
         zoomLevel,
         theme,
     });
-    /**
-     * Re-applies Book language + theme to the currently mounted Monaco model.
-     */
-    const reapplyBookLanguageAndTheme = useCallback((reason) => {
-        if (!editor || !monaco) {
-            return;
-        }
-        ensureBookEditorMonacoLanguageForEditor({ monaco, monacoEditor: editor, theme });
-        logBookEditorMonacoDebug(`Re-applied Book Monaco language/theme (${reason}).`);
-    }, [editor, monaco, theme]);
-    useEffect(() => {
-        setIsTouchDevice(typeof window !== 'undefined' && window.matchMedia('(pointer: coarse)').matches);
-    }, []);
-    useEffect(() => {
-        if (!editor || !monaco) {
-            return;
-        }
-        const focusListener = editor.onDidFocusEditorWidget(() => {
-            setIsFocused(true);
-            reapplyBookLanguageAndTheme('focus');
-        });
-        const blurListener = editor.onDidBlurEditorWidget(() => {
-            setIsFocused(false);
-        });
-        const saveAction = editor.addAction({
-            id: 'save-book',
-            label: 'Save',
-            keybindings: [monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyS],
-            run: () => {
-                setIsSavedShown(false);
-                setTimeout(() => setIsSavedShown(true), 0);
-                // Note: We don't prevent default, so browser's save dialog still opens
-            },
-        });
-        return () => {
-            focusListener.dispose();
-            blurListener.dispose();
-            saveAction.dispose();
-        };
-    }, [editor, monaco, reapplyBookLanguageAndTheme]);
-    useEffect(() => {
-        reapplyBookLanguageAndTheme('editor-ready');
-    }, [reapplyBookLanguageAndTheme]);
-    useEffect(() => {
-        if (!editor || !monaco) {
-            return;
-        }
-        const handlePopState = () => {
-            reapplyBookLanguageAndTheme('history-popstate');
-        };
-        const handlePageShow = () => {
-            reapplyBookLanguageAndTheme('pageshow');
-        };
-        const handleWindowFocus = () => {
-            reapplyBookLanguageAndTheme('window-focus');
-        };
-        const handleVisibilityChange = () => {
-            if (document.visibilityState === 'visible') {
-                reapplyBookLanguageAndTheme('visibility-visible');
-            }
-        };
-        window.addEventListener('popstate', handlePopState);
-        window.addEventListener('pageshow', handlePageShow);
-        window.addEventListener('focus', handleWindowFocus);
-        document.addEventListener('visibilitychange', handleVisibilityChange);
-        return () => {
-            window.removeEventListener('popstate', handlePopState);
-            window.removeEventListener('pageshow', handlePageShow);
-            window.removeEventListener('focus', handleWindowFocus);
-            document.removeEventListener('visibilitychange', handleVisibilityChange);
-        };
-    }, [editor, monaco, reapplyBookLanguageAndTheme]);
-    useEffect(() => {
-        if (!isSavedShown) {
-            return;
-        }
-        const timer = setTimeout(() => {
-            setIsSavedShown(false);
-        }, 2000);
-        return () => {
-            clearTimeout(timer);
-        };
-    }, [isSavedShown]);
-    const handleDrop = useCallback(async (event) => {
-        event.preventDefault();
-        setIsDragOver(false);
-        const files = getDataTransferFiles(event.dataTransfer);
-        await handleFiles(files);
-    }, [handleFiles]);
-    const handlePaste = useCallback(async (event) => {
-        const clipboardData = event.clipboardData;
-        if (!hasUploadableClipboardContent(clipboardData)) {
-            return;
-        }
-        event.preventDefault();
-        event.stopPropagation();
-        const files = await resolveClipboardUploadFiles(clipboardData);
-        await handleFiles(files);
-    }, [handleFiles]);
-    const handleUploadDocument = useCallback(() => {
-        var _a;
-        (_a = fileUploadInputRef.current) === null || _a === void 0 ? void 0 : _a.click();
-    }, []);
-    const handleTakePhoto = useCallback(() => {
-        var _a;
-        (_a = cameraInputRef.current) === null || _a === void 0 ? void 0 : _a.click();
-    }, []);
-    const handleFileInputChange = useCallback((event) => {
-        const files = Array.from(event.target.files || []);
-        void handleFiles(files);
-        event.target.value = '';
-    }, [handleFiles]);
-    /**
-     * Ensures Book language/tokenizer is ready before Monaco creates the editor model.
-     */
-    const handleBeforeMonacoMount = useCallback((beforeMountMonaco) => {
-        ensureBookEditorMonacoLanguage(beforeMountMonaco, theme);
-    }, [theme]);
-    /**
-     * Re-applies Book language/theme once Monaco editor is mounted.
-     */
-    const handleMonacoMount = useCallback((mountedEditor, mountedMonaco) => {
-        setEditor(mountedEditor);
-        ensureBookEditorMonacoLanguageForEditor({ monaco: mountedMonaco, monacoEditor: mountedEditor, theme });
-        logBookEditorMonacoDebug('Mounted Monaco editor and re-applied Book language/theme.');
-    }, [theme]);
-    const handleDragOver = useCallback((event) => {
-        event.preventDefault();
-        setIsDragOver(true);
-    }, []);
-    const handleDragEnter = useCallback((event) => {
-        event.preventDefault();
-        setIsDragOver(true);
-    }, []);
-    const handleDragLeave = useCallback((event) => {
-        event.preventDefault();
-        setIsDragOver(false);
-    }, []);
-    const focusOverlayTouchHandlers = {
-        onTouchStart: (event) => {
-            const touch = event.touches[0];
-            if (touch) {
-                touchStartRef.current = { x: touch.clientX, y: touch.clientY };
-            }
-        },
-        onTouchEnd: (event) => {
-            event.preventDefault();
-            const touch = event.changedTouches[0];
-            if (touch && touchStartRef.current) {
-                const deltaX = Math.abs(touch.clientX - touchStartRef.current.x);
-                const deltaY = Math.abs(touch.clientY - touchStartRef.current.y);
-                const threshold = 10;
-                if (deltaX < threshold && deltaY < threshold) {
-                    editor === null || editor === void 0 ? void 0 : editor.focus();
-                }
-            }
-            touchStartRef.current = null;
-        },
-    };
-    const isActionBarVisible = Boolean(hoistedMenuItems && hoistedMenuItems.length > 0) ||
-        isUploadButtonShown ||
-        isCameraButtonShown ||
-        isDownloadButtonShown ||
-        isAboutButtonShown ||
-        isFullscreenButtonShown;
     return (jsxs("div", { className: classNames(styles$d.bookEditorContainer, instanceClass), onDrop: handleDrop, onPaste: handlePaste, onDragOver: handleDragOver, onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, children: [isActionBarVisible && (jsx(BookEditorActionbar, { value,
                 isUploadButtonShown,
                 isCameraButtonShown: isCameraButtonShown !== null && isCameraButtonShown !== void 0 ? isCameraButtonShown : isTouchDevice,
@@ -25449,31 +25616,7 @@ function BookEditorMonaco(props) {
                             height: '100%',
                             width: '100%',
                             backgroundColor: 'transparent',
-                        }, ...focusOverlayTouchHandlers })), jsx(MonacoEditorWithShadowDom, { language: BookEditorMonacoConstants.BOOK_LANGUAGE_ID, theme: BookEditorMonacoConstants.BOOK_THEME_ID, path: monacoModelPath, saveViewState: Boolean(monacoModelPath), value: value, beforeMount: handleBeforeMonacoMount, onMount: handleMonacoMount, onChange: (newValue) => onChange === null || onChange === void 0 ? void 0 : onChange(newValue), options: {
-                            readOnly: isReadonly,
-                            readOnlyMessage: {
-                                value: (translations === null || translations === void 0 ? void 0 : translations.readonlyMessage) || 'You cannot edit this book',
-                            },
-                            wordWrap: 'on',
-                            minimap: { enabled: false },
-                            lineNumbers: 'off',
-                            fontSize: scaledFontSize,
-                            fontFamily: `"Playfair Display", serif`,
-                            lineHeight: scaledLineHeight,
-                            renderLineHighlight: 'none',
-                            lineDecorationsWidth: scaledContentPaddingLeft,
-                            glyphMargin: false,
-                            folding: false,
-                            lineNumbersMinChars: 0,
-                            links: true,
-                            scrollbar: {
-                                vertical: 'auto',
-                                horizontal: 'hidden',
-                                verticalScrollbarSize: scaledScrollbarSize,
-                                arrowSize: 0,
-                                useShadows: false,
-                            },
-                        }, loading: jsx("div", { className: styles$d.loading, children: "\uD83D\uDCD6" }) })] })] }));
+                        }, ...focusOverlayTouchHandlers })), jsx(MonacoEditorWithShadowDom, { language: BookEditorMonacoConstants.BOOK_LANGUAGE_ID, theme: BookEditorMonacoConstants.BOOK_THEME_ID, path: monacoModelPath, saveViewState: Boolean(monacoModelPath), value: value, beforeMount: handleBeforeMonacoMount, onMount: handleMonacoMount, onChange: (newValue) => onChange === null || onChange === void 0 ? void 0 : onChange(newValue), options: monacoOptions, loading: jsx("div", { className: styles$d.loading, children: "\uD83D\uDCD6" }) })] })] }));
 }
 
 /**
@@ -41090,8 +41233,8 @@ class OpenAiAgentKitExecutionTools extends OpenAiVectorStoreHandler {
      * Prepares an AgentKit agent with optional knowledge sources and tool definitions.
      */
     async prepareAgentKitAgent(options) {
-        var _a, _b;
-        const { name, instructions, knowledgeSources, tools, vectorStoreId: cachedVectorStoreId, storeAsPrepared, } = options;
+        var _a, _b, _c;
+        const { name, instructions, knowledgeSources, tools, nativeAgentKitTools, vectorStoreId: cachedVectorStoreId, storeAsPrepared, } = options;
         await this.ensureAgentKitDefaults();
         if (this.options.isVerbose) {
             console.info('[🤰]', 'Preparing OpenAI AgentKit agent', {
@@ -41099,6 +41242,7 @@ class OpenAiAgentKitExecutionTools extends OpenAiVectorStoreHandler {
                 instructionsLength: instructions.length,
                 knowledgeSourcesCount: (_a = knowledgeSources === null || knowledgeSources === void 0 ? void 0 : knowledgeSources.length) !== null && _a !== void 0 ? _a : 0,
                 toolsCount: (_b = tools === null || tools === void 0 ? void 0 : tools.length) !== null && _b !== void 0 ? _b : 0,
+                nativeAgentKitToolsCount: (_c = nativeAgentKitTools === null || nativeAgentKitTools === void 0 ? void 0 : nativeAgentKitTools.length) !== null && _c !== void 0 ? _c : 0,
             });
         }
         let vectorStoreId = cachedVectorStoreId;
@@ -41117,7 +41261,7 @@ class OpenAiAgentKitExecutionTools extends OpenAiVectorStoreHandler {
                 vectorStoreId,
             });
         }
-        const agentKitTools = this.buildAgentKitTools({ tools, vectorStoreId });
+        const agentKitTools = this.buildAgentKitTools({ tools, nativeAgentKitTools, vectorStoreId });
         const openAiAgentKitAgent = new Agent$1({
             name,
             model: this.agentKitModelName,
@@ -41156,11 +41300,14 @@ class OpenAiAgentKitExecutionTools extends OpenAiVectorStoreHandler {
      * Builds the tool list for AgentKit, including hosted file search when applicable.
      */
     buildAgentKitTools(options) {
-        const { tools, vectorStoreId } = options;
+        const { tools, nativeAgentKitTools, vectorStoreId } = options;
         const agentKitTools = [];
         if (vectorStoreId) {
             agentKitTools.push(fileSearchTool(vectorStoreId));
         }
+        if (nativeAgentKitTools && nativeAgentKitTools.length > 0) {
+            agentKitTools.push(...nativeAgentKitTools);
+        }
         if (tools && tools.length > 0) {
             let scriptTools = null;
             for (const toolDefinition of tools) {