@linkurious/ogma-annotations-react/dist/types/index.d.ts

A react component to add ogma annotations with react

import { Annotation } from '@linkurious/ogma-annotations';
import { AnnotationCollection } from '@linkurious/ogma-annotations';
import { AnnotationFeature } from '@linkurious/ogma-annotations';
import { ArrowProperties } from '@linkurious/ogma-annotations';
import { ArrowStyles } from '@linkurious/ogma-annotations';
import { Box } from '@linkurious/ogma-annotations';
import { BoxProperties } from '@linkurious/ogma-annotations';
import { Comment as Comment_2 } from '@linkurious/ogma-annotations';
import { CommentProps } from '@linkurious/ogma-annotations';
import { Context } from 'react';
import { Control } from '@linkurious/ogma-annotations';
import { createBox } from '@linkurious/ogma-annotations';
import { createComment } from '@linkurious/ogma-annotations';
import { createPolygon } from '@linkurious/ogma-annotations';
import { default as default_2 } from 'react';
import { getAnnotationsBounds } from '@linkurious/ogma-annotations';
import { isBox } from '@linkurious/ogma-annotations';
import { isComment } from '@linkurious/ogma-annotations';
import { isPolygon } from '@linkurious/ogma-annotations';
import { Polygon } from '@linkurious/ogma-annotations';
import { PolygonProperties } from '@linkurious/ogma-annotations';
import { ReactElement } from 'react';
import { TextStyle } from '@linkurious/ogma-annotations';

/**
 * Provides a context provider for managing annotations in a graph visualization.
 *
 * This component handles the state and interactions for creating, selecting,
 * and styling annotations, including arrow and text annotations.
 *
 * @param {Props} props - The component props containing child elements
 * @returns {ReactElement} A context provider with annotation management capabilities
 */
export declare const AnnotationsContextProvider: ({ children, annotations: initialAnnotations }: Props) => default_2.JSX.Element;

export { ArrowProperties }

/** @private */
export declare const BLACK = "#333333";

export { Box }

export { BoxProperties }

export { Comment_2 as Comment }

export { CommentProps }

/**
 * Creates a React context for managing annotations with optional type safety.
 *
 * @returns {Context<IAnnotationsContext | null>} A context for annotation-related state and operations that can be null
 */
export declare function createAnnotationsContext(): Context<IAnnotationsContext | null>;

export { createBox }

export { createComment }

export { createPolygon }

/**
 * Default arrow style for annotations.
 * @type {ArrowStyles}
 */
export declare const defaultArrowStyle: ArrowStyles;

/**
 * List of default colors for annotations.
 * @type {string[]}
 */
export declare const defaultColors: string[];

/**
 * Default text style for annotations.
 * @type {TextStyle}
 */
export declare const defaultTextStyle: TextStyle;

/**
 * List of available fonts for annotations.
 * @private
 */
export declare const fonts: string[];

/** @private */
export declare const fontSizes: number[];

export { getAnnotationsBounds }

/**
 * Defines the context interface for managing annotations in a React application.
 *
 * @interface
 * @description Provides state and methods for handling annotation collections,
 * current annotation selection, styling, and editor control.
 */
export declare interface IAnnotationsContext {
    /** Current annotations in the application. */
    annotations: AnnotationCollection;
    /** The currently selected annotation in the application. */
    currentAnnotation: AnnotationFeature | null;
    /** Sets the currently selected annotation in the application. */
    setCurrentAnnotation: (annotation: AnnotationFeature | null) => void;
    /** The current arrow style for annotations. */
    arrowStyle: ArrowStyles;
    /** The current width factor for arrow annotations. */
    arrowWidthFactor: number;
    /** Sets the width factor for arrow annotations. */
    setArrowWidthFactor: (arrowWidthFactor: number) => void;
    /** Sets the current arrow style for annotations. */
    setArrowStyle: (arrowStyle: ArrowStyles) => void;
    /** The current text style for annotations. */
    textStyle: TextStyle;
    /** The current size factor for text annotations in regards to node sizes. */
    textSizeFactor: number;
    /** Sets the size factor for text annotations. */
    setTextSizeFactor: (textSizeFactor: number) => void;
    /** Sets the current text style for annotations. */
    setTextStyle: (textStyle: TextStyle) => void;
    /** The annotations editor for managing annotations. See {@link AnnotationsEditor} */
    editor: Control;
    /** Sets the current annotations editor for managing annotations. */
    setEditor: (editor: Control) => void;
    /** Whether undo is available */
    canUndo: boolean;
    /** Whether redo is available */
    canRedo: boolean;
    /** Undo the last action */
    undo: () => boolean;
    /** Redo the last undone action */
    redo: () => boolean;
    /** Clear the history */
    clearHistory: () => void;
    /** Add annotations */
    add: (annotation: Annotation | AnnotationCollection) => void;
    /** Remove annotations */
    remove: (annotation: Annotation | AnnotationCollection) => void;
    /** Cancel the current drawing operation */
    cancelDrawing: () => void;
    /** Select annotations by ID */
    select: (ids: string | string[]) => void;
    /** Enable box drawing mode */
    enableBoxDrawing: (style?: Partial<Box["properties"]["style"]>) => void;
    /** Enable polygon drawing mode */
    enablePolygonDrawing: (style?: Partial<Polygon["properties"]["style"]>) => void;
    /** Enable comment drawing mode */
    enableCommentDrawing: (options?: {
        offsetX?: number;
        offsetY?: number;
        commentStyle?: Partial<Comment_2["properties"]>;
        arrowStyle?: Partial<ArrowProperties>;
    }) => void;
}

export declare function interpolate(t: number, min?: number, max?: number): number;

export { isBox }

export { isComment }

export { isPolygon }

export declare function mean(array: number[]): number;

export declare function normalize(t: number, min?: number, max?: number): number;

export { Polygon }

export { PolygonProperties }

declare interface Props {
    children: ReactElement | ReactElement[];
    annotations?: AnnotationCollection;
}

/**
 * Default relative padding for text annotations.
 */
export declare const RELATIVE_PADDING = 0.25;

/** @private */
export declare const TRANSPARENT = "none";

/**
 * Retrieves the current annotations context for accessing and managing annotations.
 *
 * @returns {IAnnotationsContext} The current annotations context with methods and
 * state for annotation management
 */
export declare const useAnnotationsContext: () => IAnnotationsContext;

export { }