zs_library 0.6.22 → 0.7.1

package/dist/components/index.d.ts

@@ -29,6 +29,7 @@ export { default as DockMobile, MobileIconContainer as DockMobileItem } from './
 export { useMotionValue as useDockDesktopMouseX } from 'motion/react';
 export type { DesktopIconContainerProps as DockDesktopItemProps } from './dock/dock-desktop';
 export type { MobileIconContainerProps as DockMobileItemProps } from './dock/dock-mobile';
-export { default as Editor } from './editor';
 export { default as GeoMap } from './map-view';
 export type { GeoMapProps } from './map-view';
+export { default as SimpleEditor, SimpleEditorRender, jsonToHtml, htmlToJson, EditorFormatConverter, } from './tiptap-editor/simple';
+export type { SimpleEditorProps, SimpleEditorRenderProps, SimpleEditorFeatures, EditorOutputFormat, } from './tiptap-editor/simple';

package/dist/components/tiptap-editor/simple/components/tiptap-extension/node-background-extension.d.ts

@@ -0,0 +1,23 @@
+import { Extension } from '@tiptap/core';
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        nodeBackground: {
+            setNodeBackgroundColor: (backgroundColor: string) => ReturnType;
+            unsetNodeBackgroundColor: () => ReturnType;
+            toggleNodeBackgroundColor: (backgroundColor: string) => ReturnType;
+        };
+    }
+}
+export interface NodeBackgroundOptions {
+    /**
+     * Node types that should support background colors
+     * @default ["paragraph", "heading", "blockquote", "taskList", "bulletList", "orderedList", "tableCell", "tableHeader"]
+     */
+    types: string[];
+    /**
+     * Use inline style instead of data attribute
+     * @default true
+     */
+    useStyle?: boolean;
+}
+export declare const NodeBackground: Extension<NodeBackgroundOptions, any>;

package/dist/components/tiptap-editor/simple/components/tiptap-icons/arrow-left-icon.d.ts

@@ -0,0 +1,3 @@
+type SvgProps = React.ComponentPropsWithoutRef<"svg">;
+export declare const ArrowLeftIcon: import('react').MemoExoticComponent<({ className, ...props }: SvgProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/components/tiptap-editor/simple/components/tiptap-icons/blockquote-icon.d.ts

@@ -0,0 +1,3 @@
+type SvgProps = React.ComponentPropsWithoutRef<"svg">;
+export declare const BlockquoteIcon: import('react').MemoExoticComponent<({ className, ...props }: SvgProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/components/tiptap-editor/simple/components/tiptap-icons/chevron-down-icon.d.ts

@@ -0,0 +1,3 @@
+type SvgProps = React.ComponentPropsWithoutRef<"svg">;
+export declare const ChevronDownIcon: import('react').MemoExoticComponent<({ className, ...props }: SvgProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/components/tiptap-editor/simple/components/tiptap-icons/close-icon.d.ts

@@ -0,0 +1,3 @@
+type SvgProps = React.ComponentPropsWithoutRef<"svg">;
+export declare const CloseIcon: import('react').MemoExoticComponent<({ className, ...props }: SvgProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/components/tiptap-editor/simple/components/tiptap-icons/code-block-icon.d.ts

@@ -0,0 +1,3 @@
+type SvgProps = React.ComponentPropsWithoutRef<"svg">;
+export declare const CodeBlockIcon: import('react').MemoExoticComponent<({ className, ...props }: SvgProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/components/tiptap-editor/simple/components/tiptap-icons/corner-down-left-icon.d.ts

@@ -0,0 +1,3 @@
+type SvgProps = React.ComponentPropsWithoutRef<"svg">;
+export declare const CornerDownLeftIcon: import('react').MemoExoticComponent<({ className, ...props }: SvgProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/components/tiptap-editor/simple/components/tiptap-icons/external-link-icon.d.ts

@@ -0,0 +1,3 @@
+type SvgProps = React.ComponentPropsWithoutRef<"svg">;
+export declare const ExternalLinkIcon: import('react').MemoExoticComponent<({ className, ...props }: SvgProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/components/tiptap-editor/simple/components/tiptap-icons/trash-icon.d.ts

@@ -0,0 +1,3 @@
+type SvgProps = React.ComponentPropsWithoutRef<"svg">;
+export declare const TrashIcon: import('react').MemoExoticComponent<({ className, ...props }: SvgProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/components/tiptap-editor/simple/components/tiptap-node/horizontal-rule-node/horizontal-rule-node-extension.d.ts

@@ -0,0 +1,2 @@
+export declare const HorizontalRule: import('@tiptap/core').Node<import('@tiptap/extension-horizontal-rule').HorizontalRuleOptions, any>;
+export default HorizontalRule;

package/dist/components/tiptap-editor/simple/components/tiptap-node/image-node/image-node-extension.d.ts

@@ -0,0 +1,21 @@
+export interface ImageNodeOptions {
+    inline: boolean;
+    allowBase64: boolean;
+    HTMLAttributes: Record<string, any>;
+}
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        imageNode: {
+            /**
+             * Set the image alignment
+             */
+            setImageAlign: (align: "left" | "center" | "right") => ReturnType;
+            /**
+             * Set the image width
+             */
+            setImageWidth: (width: string | number) => ReturnType;
+        };
+    }
+}
+export declare const ImageNode: import('@tiptap/core').Node<ImageNodeOptions, any>;
+export default ImageNode;

package/dist/components/tiptap-editor/simple/components/tiptap-node/image-node/image-node.d.ts

@@ -0,0 +1,3 @@
+import { NodeViewProps } from '@tiptap/react';
+import { default as React } from 'react';
+export declare const ImageNode: React.FC<NodeViewProps>;

package/dist/components/tiptap-editor/simple/components/tiptap-node/image-upload-node/image-upload-node-extension.d.ts

@@ -0,0 +1,64 @@
+import { Node } from '@tiptap/react';
+import { NodeType } from '@tiptap/pm/model';
+export type UploadFunction = (file: File, onProgress?: (event: {
+    progress: number;
+}) => void, abortSignal?: AbortSignal) => Promise<string>;
+export interface ImageUploadNodeOptions {
+    /**
+     * The type of the node.
+     * @default 'image'
+     */
+    type?: string | NodeType | undefined;
+    /**
+     * Acceptable file types for upload.
+     * @default 'image/*'
+     */
+    accept?: string;
+    /**
+     * Maximum number of files that can be uploaded.
+     * @default 1
+     */
+    limit?: number;
+    /**
+     * Maximum file size in bytes (0 for unlimited).
+     * @default 0
+     */
+    maxSize?: number;
+    /**
+     * Function to handle the upload process.
+     */
+    upload?: UploadFunction;
+    /**
+     * Callback for upload errors.
+     */
+    onError?: (error: Error) => void;
+    /**
+     * Callback for successful uploads.
+     */
+    onSuccess?: (url: string) => void;
+    /**
+     * HTML attributes to add to the image element.
+     * @default {}
+     * @example { class: 'foo' }
+     */
+    HTMLAttributes: Record<string, any>;
+}
+export interface ImageUploadNodeStorage {
+    pendingFiles: Map<string, File[]>;
+}
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        imageUpload: {
+            setImageUploadNode: (options?: ImageUploadNodeOptions) => ReturnType;
+        };
+    }
+    interface Storage {
+        imageUpload: ImageUploadNodeStorage;
+    }
+}
+/**
+ * A Tiptap node extension that creates an image upload component.
+ * @see registry/tiptap-node/image-upload-node/image-upload-node
+ */
+export declare const ImageUploadNode: Node<ImageUploadNodeOptions, ImageUploadNodeStorage>;
+export default ImageUploadNode;

package/dist/components/tiptap-editor/simple/components/tiptap-node/image-upload-node/image-upload-node.d.ts

@@ -0,0 +1,68 @@
+import { NodeViewProps } from '@tiptap/react';
+export interface FileItem {
+    /**
+     * Unique identifier for the file item
+     */
+    id: string;
+    /**
+     * The actual File object being uploaded
+     */
+    file: File;
+    /**
+     * Current upload progress as a percentage (0-100)
+     */
+    progress: number;
+    /**
+     * Current status of the file upload process
+     * @default "uploading"
+     */
+    status: "uploading" | "success" | "error";
+    /**
+     * URL to the uploaded file, available after successful upload
+     * @optional
+     */
+    url?: string;
+    /**
+     * Controller that can be used to abort the upload process
+     * @optional
+     */
+    abortController?: AbortController;
+}
+export interface UploadOptions {
+    /**
+     * Maximum allowed file size in bytes
+     */
+    maxSize: number;
+    /**
+     * Maximum number of files that can be uploaded
+     */
+    limit: number;
+    /**
+     * String specifying acceptable file types (MIME types or extensions)
+     * @example ".jpg,.png,image/jpeg" or "image/*"
+     */
+    accept: string;
+    /**
+     * Function that handles the actual file upload process
+     * @param {File} file - The file to be uploaded
+     * @param {Function} onProgress - Callback function to report upload progress
+     * @param {AbortSignal} signal - Signal that can be used to abort the upload
+     * @returns {Promise<string>} Promise resolving to the URL of the uploaded file
+     */
+    upload: (file: File, onProgress: (event: {
+        progress: number;
+    }) => void, signal: AbortSignal) => Promise<string>;
+    /**
+     * Callback triggered when a file is uploaded successfully
+     * @param {string} url - URL of the successfully uploaded file
+     * @optional
+     */
+    onSuccess?: (url: string) => void;
+    /**
+     * Callback triggered when an error occurs during upload
+     * @param {Error} error - The error that occurred
+     * @optional
+     */
+    onError?: (error: Error) => void;
+}
+export declare const ImageUploadNode: React.FC<NodeViewProps>;

package/dist/components/tiptap-editor/simple/components/tiptap-node/image-upload-node/index.d.ts

@@ -0,0 +1 @@
+export * from './image-upload-node-extension';

package/dist/components/tiptap-editor/simple/components/tiptap-ui/ai-button/ai-button.d.ts

@@ -0,0 +1,9 @@
+import { UseAiConfig } from './use-ai';
+import { ButtonProps } from '../../tiptap-ui-primitive/button';
+import { AiPreset } from '../../../lib/feature-utils';
+export interface AiButtonProps extends Omit<ButtonProps, "type" | "onError">, UseAiConfig {
+    showShortcut?: boolean;
+    hideWhenUnavailable?: boolean;
+    presets?: AiPreset[];
+}
+export declare const AiButton: import('react').ForwardRefExoticComponent<AiButtonProps & import('react').RefAttributes<HTMLButtonElement>>;

package/dist/components/tiptap-editor/simple/components/tiptap-ui/ai-button/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ai-button';
+export * from './use-ai';

package/dist/components/tiptap-editor/simple/components/tiptap-ui/ai-button/use-ai.d.ts

@@ -0,0 +1,38 @@
+import { Editor } from '@tiptap/react';
+import { AiCompletionOptions } from '../../../lib/ai-service';
+export interface UseAiConfig {
+    editor: Editor | null;
+    defaultPrompt?: string;
+    defaultModel?: string;
+    systemPrompt?: string;
+    apiKey?: string;
+    baseUrl?: string;
+    model?: string;
+    headers?: Record<string, string>;
+    params?: Record<string, string>;
+    body?: Record<string, unknown>;
+    request?: (options: AiCompletionOptions) => Promise<string>;
+    onStart?: () => void;
+    onSuccess?: (content: string) => void;
+    onError?: (error: Error) => void;
+}
+export type AiStatus = "idle" | "generating" | "reviewing";
+export declare function useAi({ editor, defaultPrompt, defaultModel, systemPrompt, apiKey: propApiKey, baseUrl, model: propModel, headers, params, body, request, onStart, onSuccess, onError, }: UseAiConfig): {
+    isOpen: boolean;
+    setIsOpen: (open: boolean) => void;
+    prompt: string;
+    setPrompt: import('react').Dispatch<import('react').SetStateAction<string>>;
+    status: AiStatus;
+    apiKey: string;
+    setApiKey: import('react').Dispatch<import('react').SetStateAction<string>>;
+    error: string | null;
+    handleGenerate: (promptOverride?: string) => Promise<void>;
+    handleStop: () => void;
+    handleDiscard: () => void;
+    handleApply: () => void;
+    handleRefine: () => void;
+    handleTryAgain: () => void;
+    selectionText: string;
+    hasSelection: boolean;
+    lastPrompt: string;
+};

package/dist/components/tiptap-editor/simple/components/tiptap-ui/blockquote-button/blockquote-button.d.ts

@@ -0,0 +1,22 @@
+import { UseBlockquoteConfig } from './use-blockquote';
+import { ButtonProps } from '../../tiptap-ui-primitive/button';
+export interface BlockquoteButtonProps extends Omit<ButtonProps, "type">, UseBlockquoteConfig {
+    /**
+     * Optional text to display alongside the icon.
+     */
+    text?: string;
+    /**
+     * Optional show shortcut keys in the button.
+     * @default false
+     */
+    showShortcut?: boolean;
+}
+export declare function BlockquoteShortcutBadge({ shortcutKeys }: {
+    shortcutKeys?: string;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * Button component for toggling blockquote in a Tiptap editor.
+ *
+ * For custom button implementations, use the `useBlockquote` hook instead.
+ */
+export declare const BlockquoteButton: import('react').ForwardRefExoticComponent<BlockquoteButtonProps & import('react').RefAttributes<HTMLButtonElement>>;

package/dist/components/tiptap-editor/simple/components/tiptap-ui/blockquote-button/index.d.ts

@@ -0,0 +1,2 @@
+export * from './blockquote-button';
+export * from './use-blockquote';

package/dist/components/tiptap-editor/simple/components/tiptap-ui/blockquote-button/use-blockquote.d.ts

@@ -0,0 +1,80 @@
+import { Editor } from '@tiptap/react';
+export declare const BLOCKQUOTE_SHORTCUT_KEY = "mod+shift+b";
+/**
+ * Configuration for the blockquote functionality
+ */
+export interface UseBlockquoteConfig {
+    /**
+     * The Tiptap editor instance.
+     */
+    editor?: Editor | null;
+    /**
+     * Whether the button should hide when blockquote is not available.
+     * @default false
+     */
+    hideWhenUnavailable?: boolean;
+    /**
+     * Callback function called after a successful toggle.
+     */
+    onToggled?: () => void;
+}
+/**
+ * Checks if blockquote can be toggled in the current editor state
+ */
+export declare function canToggleBlockquote(editor: Editor | null, turnInto?: boolean): boolean;
+/**
+ * Toggles blockquote formatting for a specific node or the current selection
+ */
+export declare function toggleBlockquote(editor: Editor | null): boolean;
+/**
+ * Determines if the blockquote button should be shown
+ */
+export declare function shouldShowButton(props: {
+    editor: Editor | null;
+    hideWhenUnavailable: boolean;
+}): boolean;
+/**
+ * Custom hook that provides blockquote functionality for Tiptap editor
+ *
+ * @example
+ * ```tsx
+ * // Simple usage - no params needed
+ * function MySimpleBlockquoteButton() {
+ *   const { isVisible, handleToggle, isActive } = useBlockquote()
+ *
+ *   if (!isVisible) return null
+ *
+ *   return <button onClick={handleToggle}>Blockquote</button>
+ * }
+ *
+ * // Advanced usage with configuration
+ * function MyAdvancedBlockquoteButton() {
+ *   const { isVisible, handleToggle, label, isActive } = useBlockquote({
+ *     editor: myEditor,
+ *     hideWhenUnavailable: true,
+ *     onToggled: () => console.log('Blockquote toggled!')
+ *   })
+ *
+ *   if (!isVisible) return null
+ *
+ *   return (
+ *     <MyButton
+ *       onClick={handleToggle}
+ *       aria-label={label}
+ *       aria-pressed={isActive}
+ *     >
+ *       Toggle Blockquote
+ *     </MyButton>
+ *   )
+ * }
+ * ```
+ */
+export declare function useBlockquote(config?: UseBlockquoteConfig): {
+    isVisible: boolean;
+    isActive: boolean;
+    handleToggle: () => boolean;
+    canToggle: boolean;
+    label: string;
+    shortcutKeys: string;
+    Icon: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element>;
+};

package/dist/components/tiptap-editor/simple/components/tiptap-ui/code-block-button/code-block-button.d.ts

@@ -0,0 +1,22 @@
+import { UseCodeBlockConfig } from './use-code-block';
+import { ButtonProps } from '../../tiptap-ui-primitive/button';
+export interface CodeBlockButtonProps extends Omit<ButtonProps, "type">, UseCodeBlockConfig {
+    /**
+     * Optional text to display alongside the icon.
+     */
+    text?: string;
+    /**
+     * Optional show shortcut keys in the button.
+     * @default false
+     */
+    showShortcut?: boolean;
+}
+export declare function CodeBlockShortcutBadge({ shortcutKeys }: {
+    shortcutKeys?: string;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * Button component for toggling code block in a Tiptap editor.
+ *
+ * For custom button implementations, use the `useCodeBlock` hook instead.
+ */
+export declare const CodeBlockButton: import('react').ForwardRefExoticComponent<CodeBlockButtonProps & import('react').RefAttributes<HTMLButtonElement>>;

package/dist/components/tiptap-editor/simple/components/tiptap-ui/code-block-button/index.d.ts

@@ -0,0 +1,2 @@
+export * from './code-block-button';
+export * from './use-code-block';

package/dist/components/tiptap-editor/simple/components/tiptap-ui/code-block-button/use-code-block.d.ts

@@ -0,0 +1,87 @@
+import { Editor } from '@tiptap/react';
+export declare const CODE_BLOCK_SHORTCUT_KEY = "mod+alt+c";
+/**
+ * Configuration for the code block functionality
+ */
+export interface UseCodeBlockConfig {
+    /**
+     * The Tiptap editor instance.
+     */
+    editor?: Editor | null;
+    /**
+     * Whether the button should hide when code block is not available.
+     * @default false
+     */
+    hideWhenUnavailable?: boolean;
+    /**
+     * Callback function called after a successful code block toggle.
+     */
+    onToggled?: () => void;
+}
+/**
+ * Checks if code block can be toggled in the current editor state
+ */
+export declare function canToggle(editor: Editor | null, turnInto?: boolean): boolean;
+/**
+ * Toggles code block in the editor
+ */
+export declare function toggleCodeBlock(editor: Editor | null): boolean;
+/**
+ * Determines if the code block button should be shown
+ */
+export declare function shouldShowButton(props: {
+    editor: Editor | null;
+    hideWhenUnavailable: boolean;
+}): boolean;
+/**
+ * Custom hook that provides code block functionality for Tiptap editor
+ *
+ * @example
+ * ```tsx
+ * // Simple usage - no params needed
+ * function MySimpleCodeBlockButton() {
+ *   const { isVisible, isActive, handleToggle } = useCodeBlock()
+ *
+ *   if (!isVisible) return null
+ *
+ *   return (
+ *     <button
+ *       onClick={handleToggle}
+ *       aria-pressed={isActive}
+ *     >
+ *       Code Block
+ *     </button>
+ *   )
+ * }
+ *
+ * // Advanced usage with configuration
+ * function MyAdvancedCodeBlockButton() {
+ *   const { isVisible, isActive, handleToggle, label } = useCodeBlock({
+ *     editor: myEditor,
+ *     hideWhenUnavailable: true,
+ *     onToggled: (isActive) => console.log('Code block toggled:', isActive)
+ *   })
+ *
+ *   if (!isVisible) return null
+ *
+ *   return (
+ *     <MyButton
+ *       onClick={handleToggle}
+ *       aria-label={label}
+ *       aria-pressed={isActive}
+ *     >
+ *       Toggle Code Block
+ *     </MyButton>
+ *   )
+ * }
+ * ```
+ */
+export declare function useCodeBlock(config?: UseCodeBlockConfig): {
+    isVisible: boolean;
+    isActive: boolean;
+    handleToggle: () => boolean;
+    canToggle: boolean;
+    label: string;
+    shortcutKeys: string;
+    Icon: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react/jsx-runtime").JSX.Element>;
+};

package/dist/components/tiptap-editor/simple/components/tiptap-ui/color-highlight-button/color-highlight-button.d.ts

@@ -0,0 +1,45 @@
+import { UseColorHighlightConfig } from './use-color-highlight';
+import { ButtonProps } from '../../tiptap-ui-primitive/button';
+export interface ColorHighlightButtonProps extends Omit<ButtonProps, "type">, UseColorHighlightConfig {
+    /**
+     * Optional text to display alongside the icon.
+     */
+    text?: string;
+    /**
+     * Optional show shortcut keys in the button.
+     * @default false
+     */
+    showShortcut?: boolean;
+}
+export declare function ColorHighlightShortcutBadge({ shortcutKeys, }: {
+    shortcutKeys?: string;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * Button component for applying color highlights in a Tiptap editor.
+ *
+ * Supports two highlighting modes:
+ * - "mark": Uses the highlight mark extension (default)
+ * - "node": Uses the node background extension
+ *
+ * For custom button implementations, use the `useColorHighlight` hook instead.
+ *
+ * @example
+ * ```tsx
+ * // Mark-based highlighting (default)
+ * <ColorHighlightButton highlightColor="yellow" />
+ *
+ * // Node-based background coloring
+ * <ColorHighlightButton
+ *   highlightColor="var(--tt-color-highlight-blue)"
+ *   mode="node"
+ * />
+ *
+ * // With custom callback
+ * <ColorHighlightButton
+ *   highlightColor="red"
+ *   mode="mark"
+ *   onApplied={({ color, mode }) => console.log(`Applied ${color} in ${mode} mode`)}
+ * />
+ * ```
+ */
+export declare const ColorHighlightButton: import('react').ForwardRefExoticComponent<ColorHighlightButtonProps & import('react').RefAttributes<HTMLButtonElement>>;

package/dist/components/tiptap-editor/simple/components/tiptap-ui/color-highlight-button/index.d.ts

@@ -0,0 +1,2 @@
+export * from './color-highlight-button';
+export * from './use-color-highlight';

package/dist/components/tiptap-editor/simple/components/tiptap-ui/color-highlight-button/use-color-highlight.d.ts

@@ -0,0 +1,82 @@
+import { Editor } from '@tiptap/react';
+export declare const COLOR_HIGHLIGHT_SHORTCUT_KEY = "mod+shift+h";
+export declare const HIGHLIGHT_COLORS: {
+    label: string;
+    value: string;
+    border: string;
+}[];
+export type HighlightColor = (typeof HIGHLIGHT_COLORS)[number];
+export type HighlightMode = "mark" | "node";
+/**
+ * Configuration for the color highlight functionality
+ */
+export interface UseColorHighlightConfig {
+    /**
+     * The Tiptap editor instance.
+     */
+    editor?: Editor | null;
+    /**
+     * The color to apply when toggling the highlight.
+     */
+    highlightColor?: string;
+    /**
+     * Optional label to display alongside the icon.
+     */
+    label?: string;
+    /**
+     * Whether the button should hide when the mark is not available.
+     * @default false
+     */
+    hideWhenUnavailable?: boolean;
+    /**
+     * The highlighting mode to use.
+     * - "mark": Uses the highlight mark extension (default)
+     * - "node": Uses the node background extension
+     * @default "mark"
+     */
+    mode?: HighlightMode;
+    /**
+     * Called when the highlight is applied.
+     */
+    onApplied?: ({ color, label, mode }: {
+        color: string;
+        label: string;
+        mode: HighlightMode;
+    }) => void;
+}
+export declare function pickHighlightColorsByValue(values: string[]): {
+    label: string;
+    value: string;
+    border: string;
+}[];
+/**
+ * Checks if highlight can be applied based on the mode and current editor state
+ */
+export declare function canColorHighlight(editor: Editor | null, mode?: HighlightMode): boolean;
+/**
+ * Checks if highlight is currently active
+ */
+export declare function isColorHighlightActive(editor: Editor | null, highlightColor?: string, mode?: HighlightMode): boolean;
+/**
+ * Removes highlight based on the mode
+ */
+export declare function removeHighlight(editor: Editor | null, mode?: HighlightMode): boolean;
+/**
+ * Determines if the highlight button should be shown
+ */
+export declare function shouldShowButton(props: {
+    editor: Editor | null;
+    hideWhenUnavailable: boolean;
+    mode: HighlightMode;
+}): boolean;
+export declare function useColorHighlight(config: UseColorHighlightConfig): {
+    isVisible: boolean;
+    isActive: boolean;
+    handleColorHighlight: () => boolean;
+    handleRemoveHighlight: () => boolean;
+    canColorHighlight: boolean;
+    label: string;
+    shortcutKeys: string;
+    Icon: import('@remixicon/react').RemixiconComponentType;
+    mode: HighlightMode;
+};