import * as React from "react"; import { type Editor } from "@tiptap/react"; export type Level = 1 | 2 | 3 | 4 | 5 | 6; /** * Configuration for the heading functionality */ export interface UseHeadingConfig { /** * The Tiptap editor instance. */ editor?: Editor | null; /** * The heading level. */ level: Level; /** * Whether the button should hide when heading is not available. * @default false */ hideWhenUnavailable?: boolean; /** * Callback function called after a successful heading toggle. */ onToggled?: () => void; } export declare const headingIcons: { 1: React.MemoExoticComponent<({ className, ...props }: React.SVGProps) => import("react/jsx-runtime").JSX.Element>; 2: React.MemoExoticComponent<({ className, ...props }: React.SVGProps) => import("react/jsx-runtime").JSX.Element>; 3: React.MemoExoticComponent<({ className, ...props }: React.SVGProps) => import("react/jsx-runtime").JSX.Element>; 4: React.MemoExoticComponent<({ className, ...props }: React.SVGProps) => import("react/jsx-runtime").JSX.Element>; 5: React.MemoExoticComponent<({ className, ...props }: React.SVGProps) => import("react/jsx-runtime").JSX.Element>; 6: React.MemoExoticComponent<({ className, ...props }: React.SVGProps) => import("react/jsx-runtime").JSX.Element>; }; export declare const HEADING_SHORTCUT_KEYS: Record; /** * Checks if heading can be toggled in the current editor state */ export declare function canToggle(editor: Editor | null, level?: Level, turnInto?: boolean): boolean; /** * Checks if heading is currently active */ export declare function isHeadingActive(editor: Editor | null, level?: Level | Level[]): boolean; /** * Toggles heading in the editor */ export declare function toggleHeading(editor: Editor | null, level: Level | Level[]): boolean; /** * Determines if the heading button should be shown */ export declare function shouldShowButton(props: { editor: Editor | null; level?: Level | Level[]; hideWhenUnavailable: boolean; }): boolean; /** * Custom hook that provides heading functionality for Tiptap editor * * @example * ```tsx * // Simple usage * function MySimpleHeadingButton() { * const { isVisible, isActive, handleToggle, Icon } = useHeading({ level: 1 }) * * if (!isVisible) return null * * return ( * * ) * } * * // Advanced usage with configuration * function MyAdvancedHeadingButton() { * const { isVisible, isActive, handleToggle, label, Icon } = useHeading({ * level: 2, * editor: myEditor, * hideWhenUnavailable: true, * onToggled: (isActive) => console.log('Heading toggled:', isActive) * }) * * if (!isVisible) return null * * return ( * * * Toggle Heading 2 * * ) * } * ``` */ export declare function useHeading(config: UseHeadingConfig): { isVisible: boolean; isActive: boolean; handleToggle: () => boolean; canToggle: boolean; label: string; shortcutKeys: string; Icon: React.MemoExoticComponent<({ className, ...props }: React.SVGProps) => import("react/jsx-runtime").JSX.Element> | React.MemoExoticComponent<({ className, ...props }: React.SVGProps) => import("react/jsx-runtime").JSX.Element> | React.MemoExoticComponent<({ className, ...props }: React.SVGProps) => import("react/jsx-runtime").JSX.Element> | React.MemoExoticComponent<({ className, ...props }: React.SVGProps) => import("react/jsx-runtime").JSX.Element> | React.MemoExoticComponent<({ className, ...props }: React.SVGProps) => import("react/jsx-runtime").JSX.Element> | React.MemoExoticComponent<({ className, ...props }: React.SVGProps) => import("react/jsx-runtime").JSX.Element>; }; //# sourceMappingURL=use-heading.d.ts.map