planet-editor 0.1.0

package/dist/lib/components/planet-ui/code-block-button/code-block-button.d.ts

@@ -0,0 +1,22 @@
+import { UseCodeBlockConfig } from '.';
+import { ButtonProps } from '../../planet-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.Element;
+/**
+ * Button component for toggling code block in a Planet editor.
+ *
+ * For custom button implementations, use the `useCodeBlock` hook instead.
+ */
+export declare const CodeBlockButton: import('react').ForwardRefExoticComponent<CodeBlockButtonProps & import('react').RefAttributes<HTMLButtonElement>>;

package/dist/lib/components/planet-ui/code-block-button/index.d.ts

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

package/dist/lib/components/planet-ui/code-block-button/use-code-block.d.ts

@@ -0,0 +1,87 @@
+import { Editor } from '../../../planet-core/react';
+export declare const CODE_BLOCK_SHORTCUT_KEY = "mod+alt+c";
+/**
+ * Configuration for the code block functionality
+ */
+export interface UseCodeBlockConfig {
+    /**
+     * The Planet 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 Planet 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.Element>;
+};

package/dist/lib/components/planet-ui/color-highlight-button/color-highlight-button.d.ts

@@ -0,0 +1,45 @@
+import { UseColorHighlightConfig } from '.';
+import { ButtonProps } from '../../planet-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.Element;
+/**
+ * Button component for applying color highlights in a Planet 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/lib/components/planet-ui/color-highlight-button/index.d.ts

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

package/dist/lib/components/planet-ui/color-highlight-button/use-color-highlight.d.ts

@@ -0,0 +1,93 @@
+import { Editor } from '../../../planet-core/react';
+export declare const COLOR_HIGHLIGHT_SHORTCUT_KEY = "mod+shift+h";
+export declare const HIGHLIGHT_COLORS: {
+    label: string;
+    value: string;
+    colorValue: 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 Planet 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;
+    /**
+     * When true, uses the actual color value (colorValue) instead of CSS variable (value).
+     * @default false
+     */
+    useColorValue?: boolean;
+    /**
+     * 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;
+    colorValue: string;
+    border: string;
+}[];
+/**
+ * Gets the appropriate color value based on configuration
+ */
+export declare function getHighlightColorValue(color: string, useColorValue?: boolean): 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('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react").JSX.Element>;
+    mode: HighlightMode;
+};

package/dist/lib/components/planet-ui/color-highlight-popover/color-highlight-popover.d.ts

@@ -0,0 +1,35 @@
+import { Editor } from '../../../planet-core/react';
+import { ButtonProps } from '../../planet-ui-primitive/button';
+import { HighlightColor, UseColorHighlightConfig } from '../color-highlight-button';
+export interface ColorHighlightPopoverContentProps {
+    /**
+     * The Planet editor instance.
+     */
+    editor?: Editor | null;
+    /**
+     * Optional colors to use in the highlight popover.
+     * If not provided, defaults to a predefined set of colors.
+     */
+    colors?: HighlightColor[];
+    /**
+     * When true, uses the actual color value (colorValue) instead of CSS variable (value).
+     * @default false
+     */
+    useColorValue?: boolean;
+}
+export interface ColorHighlightPopoverProps extends Omit<ButtonProps, "type">, Pick<UseColorHighlightConfig, "editor" | "hideWhenUnavailable" | "onApplied"> {
+    /**
+     * Optional colors to use in the highlight popover.
+     * If not provided, defaults to a predefined set of colors.
+     */
+    colors?: HighlightColor[];
+    /**
+     * When true, uses the actual color value (colorValue) instead of CSS variable (value).
+     * @default false
+     */
+    useColorValue?: boolean;
+}
+export declare const ColorHighlightPopoverButton: import('react').ForwardRefExoticComponent<ButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
+export declare function ColorHighlightPopoverContent({ editor, colors, useColorValue, }: ColorHighlightPopoverContentProps): import("react").JSX.Element;
+export declare function ColorHighlightPopover({ editor: providedEditor, colors, hideWhenUnavailable, useColorValue, onApplied, ...props }: ColorHighlightPopoverProps): import("react").JSX.Element | null;
+export default ColorHighlightPopover;

package/dist/lib/components/planet-ui/color-highlight-popover/index.d.ts

@@ -0,0 +1 @@
+export * from './color-highlight-popover';

package/dist/lib/components/planet-ui/font-size-dropdown-menu/font-size-dropdown-menu.d.ts

@@ -0,0 +1,10 @@
+import { Editor } from '../../../planet-core/react';
+export interface FontSizeDropdownMenuProps {
+    editor?: Editor;
+}
+/**
+ * Toolbar dropdown for setting the font size. Pick a preset or type a custom
+ * value (in px) in the input at the top and press Enter to apply.
+ */
+export declare function FontSizeDropdownMenu({ editor: providedEditor, }: FontSizeDropdownMenuProps): import("react").JSX.Element | null;
+export default FontSizeDropdownMenu;

package/dist/lib/components/planet-ui/font-size-dropdown-menu/index.d.ts

@@ -0,0 +1 @@
+export { FontSizeDropdownMenu } from './font-size-dropdown-menu';

package/dist/lib/components/planet-ui/heading-button/heading-button.d.ts

@@ -0,0 +1,23 @@
+import { Level, UseHeadingConfig } from '.';
+import { ButtonProps } from '../../planet-ui-primitive/button';
+export interface HeadingButtonProps extends Omit<ButtonProps, "type">, UseHeadingConfig {
+    /**
+     * Optional text to display alongside the icon.
+     */
+    text?: string;
+    /**
+     * Optional show shortcut keys in the button.
+     * @default false
+     */
+    showShortcut?: boolean;
+}
+export declare function HeadingShortcutBadge({ level, shortcutKeys, }: {
+    level: Level;
+    shortcutKeys?: string;
+}): import("react").JSX.Element;
+/**
+ * Button component for toggling heading in a Planet editor.
+ *
+ * For custom button implementations, use the `useHeading` hook instead.
+ */
+export declare const HeadingButton: import('react').ForwardRefExoticComponent<HeadingButtonProps & import('react').RefAttributes<HTMLButtonElement>>;

package/dist/lib/components/planet-ui/heading-button/index.d.ts

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

package/dist/lib/components/planet-ui/heading-button/use-heading.d.ts

@@ -0,0 +1,108 @@
+import { Editor } from '../../../planet-core/react';
+export type Level = 1 | 2 | 3 | 4 | 5 | 6;
+/**
+ * Configuration for the heading functionality
+ */
+export interface UseHeadingConfig {
+    /**
+     * The Planet 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: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react").JSX.Element>;
+    2: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react").JSX.Element>;
+    3: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react").JSX.Element>;
+    4: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react").JSX.Element>;
+    5: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react").JSX.Element>;
+    6: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react").JSX.Element>;
+};
+export declare const HEADING_SHORTCUT_KEYS: Record<Level, string>;
+/**
+ * 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 Planet editor
+ *
+ * @example
+ * ```tsx
+ * // Simple usage
+ * function MySimpleHeadingButton() {
+ *   const { isVisible, isActive, handleToggle, Icon } = useHeading({ level: 1 })
+ *
+ *   if (!isVisible) return null
+ *
+ *   return (
+ *     <button
+ *       onClick={handleToggle}
+ *       aria-pressed={isActive}
+ *     >
+ *       <Icon />
+ *       Heading 1
+ *     </button>
+ *   )
+ * }
+ *
+ * // 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 (
+ *     <MyButton
+ *       onClick={handleToggle}
+ *       aria-label={label}
+ *       aria-pressed={isActive}
+ *     >
+ *       <Icon />
+ *       Toggle Heading 2
+ *     </MyButton>
+ *   )
+ * }
+ * ```
+ */
+export declare function useHeading(config: UseHeadingConfig): {
+    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.Element> | import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react").JSX.Element> | import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react").JSX.Element> | import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react").JSX.Element> | import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react").JSX.Element> | import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react").JSX.Element>;
+};

package/dist/lib/components/planet-ui/heading-dropdown-menu/heading-dropdown-menu.d.ts

@@ -0,0 +1,19 @@
+import { UseHeadingDropdownMenuConfig } from '.';
+import { ButtonProps } from '../../planet-ui-primitive/button';
+export interface HeadingDropdownMenuProps extends Omit<ButtonProps, "type">, UseHeadingDropdownMenuConfig {
+    /**
+     * Callback for when the dropdown opens or closes
+     */
+    onOpenChange?: (isOpen: boolean) => void;
+    /**
+     * Whether the dropdown should use a modal
+     */
+    modal?: boolean;
+}
+/**
+ * Dropdown menu component for selecting heading levels in a Planet editor.
+ *
+ * For custom dropdown implementations, use the `useHeadingDropdownMenu` hook instead.
+ */
+export declare const HeadingDropdownMenu: import('react').ForwardRefExoticComponent<HeadingDropdownMenuProps & import('react').RefAttributes<HTMLButtonElement>>;
+export default HeadingDropdownMenu;

package/dist/lib/components/planet-ui/heading-dropdown-menu/index.d.ts

@@ -0,0 +1,2 @@
+export * from './heading-dropdown-menu';
+export * from './use-heading-dropdown-menu';

package/dist/lib/components/planet-ui/heading-dropdown-menu/use-heading-dropdown-menu.d.ts

@@ -0,0 +1,73 @@
+import { Editor } from '../../../planet-core/react';
+import { Level } from '../heading-button';
+/**
+ * Configuration for the heading dropdown menu functionality
+ */
+export interface UseHeadingDropdownMenuConfig {
+    /**
+     * The Planet editor instance.
+     */
+    editor?: Editor | null;
+    /**
+     * Available heading levels to show in the dropdown
+     * @default [1, 2, 3, 4, 5, 6]
+     */
+    levels?: Level[];
+    /**
+     * Whether the dropdown should hide when headings are not available.
+     * @default false
+     */
+    hideWhenUnavailable?: boolean;
+}
+/**
+ * Gets the currently active heading level from the available levels
+ */
+export declare function getActiveHeadingLevel(editor: Editor | null, levels?: Level[]): Level | undefined;
+/**
+ * Custom hook that provides heading dropdown menu functionality for Planet editor
+ *
+ * @example
+ * ```tsx
+ * // Simple usage
+ * function MyHeadingDropdown() {
+ *   const {
+ *     isVisible,
+ *     activeLevel,
+ *     isAnyHeadingActive,
+ *     canToggle,
+ *     levels,
+ *   } = useHeadingDropdownMenu()
+ *
+ *   if (!isVisible) return null
+ *
+ *   return (
+ *     <DropdownMenu>
+ *       // dropdown content
+ *     </DropdownMenu>
+ *   )
+ * }
+ *
+ * // Advanced usage with configuration
+ * function MyAdvancedHeadingDropdown() {
+ *   const {
+ *     isVisible,
+ *     activeLevel,
+ *   } = useHeadingDropdownMenu({
+ *     editor: myEditor,
+ *     levels: [1, 2, 3],
+ *     hideWhenUnavailable: true,
+ *   })
+ *
+ *   // component implementation
+ * }
+ * ```
+ */
+export declare function useHeadingDropdownMenu(config?: UseHeadingDropdownMenuConfig): {
+    isVisible: boolean;
+    activeLevel: Level | undefined;
+    isActive: boolean;
+    canToggle: boolean;
+    levels: Level[];
+    label: string;
+    Icon: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react").JSX.Element>;
+};

package/dist/lib/components/planet-ui/image-upload-button/image-upload-button.d.ts

@@ -0,0 +1,29 @@
+import { UseImageUploadConfig } from '.';
+import { ButtonProps } from '../../planet-ui-primitive/button';
+type IconProps = React.SVGProps<SVGSVGElement>;
+type IconComponent = ({ className, ...props }: IconProps) => React.ReactElement;
+export interface ImageUploadButtonProps extends Omit<ButtonProps, "type">, UseImageUploadConfig {
+    /**
+     * Optional text to display alongside the icon.
+     */
+    text?: string;
+    /**
+     * Optional show shortcut keys in the button.
+     * @default false
+     */
+    showShortcut?: boolean;
+    /**
+     * Optional custom icon component to render instead of the default.
+     */
+    icon?: React.MemoExoticComponent<IconComponent> | React.FC<IconProps>;
+}
+export declare function ImageShortcutBadge({ shortcutKeys, }: {
+    shortcutKeys?: string;
+}): import("react").JSX.Element;
+/**
+ * Button component for uploading/inserting images in a Planet editor.
+ *
+ * For custom button implementations, use the `useImage` hook instead.
+ */
+export declare const ImageUploadButton: import('react').ForwardRefExoticComponent<ImageUploadButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
+export {};

package/dist/lib/components/planet-ui/image-upload-button/index.d.ts

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

package/dist/lib/components/planet-ui/image-upload-button/use-image-upload.d.ts

@@ -0,0 +1,84 @@
+import { Editor } from '../../../planet-core/react';
+export declare const IMAGE_UPLOAD_SHORTCUT_KEY = "mod+shift+i";
+/**
+ * Configuration for the image upload functionality
+ */
+export interface UseImageUploadConfig {
+    /**
+     * The Planet editor instance.
+     */
+    editor?: Editor | null;
+    /**
+     * Whether the button should hide when insertion is not available.
+     * @default false
+     */
+    hideWhenUnavailable?: boolean;
+    /**
+     * Callback function called after a successful image insertion.
+     */
+    onInserted?: () => void;
+}
+/**
+ * Checks if image can be inserted in the current editor state
+ */
+export declare function canInsertImage(editor: Editor | null): boolean;
+/**
+ * Checks if image is currently active
+ */
+export declare function isImageActive(editor: Editor | null): boolean;
+/**
+ * Inserts an image in the editor
+ */
+export declare function insertImage(editor: Editor | null): boolean;
+/**
+ * Determines if the image button should be shown
+ */
+export declare function shouldShowButton(props: {
+    editor: Editor | null;
+    hideWhenUnavailable: boolean;
+}): boolean;
+/**
+ * Custom hook that provides image functionality for Planet editor
+ *
+ * @example
+ * ```tsx
+ * // Simple usage - no params needed
+ * function MySimpleImageButton() {
+ *   const { isVisible, handleImage } = useImage()
+ *
+ *   if (!isVisible) return null
+ *
+ *   return <button onClick={handleImage}>Add Image</button>
+ * }
+ *
+ * // Advanced usage with configuration
+ * function MyAdvancedImageButton() {
+ *   const { isVisible, handleImage, label, isActive } = useImage({
+ *     editor: myEditor,
+ *     hideWhenUnavailable: true,
+ *     onInserted: () => console.log('Image inserted!')
+ *   })
+ *
+ *   if (!isVisible) return null
+ *
+ *   return (
+ *     <MyButton
+ *       onClick={handleImage}
+ *       aria-pressed={isActive}
+ *       aria-label={label}
+ *     >
+ *       Add Image
+ *     </MyButton>
+ *   )
+ * }
+ * ```
+ */
+export declare function useImageUpload(config?: UseImageUploadConfig): {
+    isVisible: boolean;
+    isActive: boolean;
+    handleImage: () => boolean;
+    canInsert: boolean;
+    label: string;
+    shortcutKeys: string;
+    Icon: import('react').MemoExoticComponent<({ className, ...props }: Omit<import('react').SVGProps<SVGSVGElement>, "ref">) => import("react").JSX.Element>;
+};

package/dist/lib/components/planet-ui/link-popover/index.d.ts

@@ -0,0 +1,2 @@
+export * from './link-popover';
+export * from './use-link-popover';