extension-annotation
package @remirror/extension-annotation
class AnnotationExtension
This extension allows to annotate the content in your editor.
Extend the Annotation interface to store application specific information like tags or color.
Signature:
export declare class AnnotationExtension<Type extends Annotation = Annotation> extends PlainExtension<AnnotationOptions<Type>>
Extends: PlainExtension<AnnotationOptions<Type>>
(Some inherited members may not be shown because they are not represented in the documentation.)
property name
Signature:
get name(): "annotation";
method addAnnotation
Adds an annotation spanning the currently selected content.
In order to use this command make sure you have the [[AnnotationExtension
]] added to your editor.
Signature:
addAnnotation(annotationData: OmitTextAndPosition<Type>): CommandFunction;
Parameters:
Parameter | Type | Description |
---|---|---|
annotationData | OmitTextAndPosition<Type> | the data for the provided annotation. |
Returns:
CommandFunction
method createPlugin
Create the custom code block plugin which handles the delete key amongst other things.
Signature:
createPlugin(): CreateExtensionPlugin<AnnotationState<Type>>;
Returns:
CreateExtensionPlugin<AnnotationState<Type>>
method getAnnotations
Signature:
getAnnotations(): Helper<Type[]>;
Returns:
Helper<Type[]>
all annotations in the editor.
In order to use this helper make sure you have the [[AnnotationExtension
]] added to your editor.
method getAnnotationsAt
Signature:
getAnnotationsAt(pos?: PrimitiveSelection, includeEdges?: boolean): Helper<Type[]>;
Parameters:
Parameter | Type | Description |
---|---|---|
pos | PrimitiveSelection | (Optional) the position in the root document to find annotations. |
includeEdges | boolean | (Optional) whether to match annotations that start or end exactly on the given pos |
Returns:
Helper<Type[]>
all annotations at a specific position in the editor.
In order to use this helper make sure you have the [[AnnotationExtension
]] added to your editor.
method onSetOptions
Signature:
protected onSetOptions(props: OnSetOptionsProps<AnnotationOptions<Type>>): void;
Parameters:
Parameter | Type | Description |
---|---|---|
props | OnSetOptionsProps<AnnotationOptions<Type>> |
Returns:
void
method redrawAnnotations
Forcefully redraws the annotations
Call this function if the styling of the annotations changes.
Signature:
redrawAnnotations(): CommandFunction;
Returns:
CommandFunction
method removeAnnotations
Removes a list of annotations.
In order to use this command make sure you have the [[AnnotationExtension
]] added to your editor.
Signature:
removeAnnotations(annotationIds: string[]): CommandFunction;
Parameters:
Parameter | Type | Description |
---|---|---|
annotationIds | string[] | the ids of the annotations to be removed. |
Returns:
CommandFunction
method selectionHasAnnotation
Signature:
selectionHasAnnotation(pos?: PrimitiveSelection): Helper<boolean>;
Parameters:
Parameter | Type | Description |
---|---|---|
pos | PrimitiveSelection | (Optional) the optional selection to check for, if left undefined it default to the current selection |
Returns:
Helper<boolean>
true if the selection includes an annotation or is included within an annotation.
In order to use this helper make sure you have the [[AnnotationExtension
]] added to your editor.
method setAnnotations
Sets the annotation. Use this to initialize the extension based on loaded data.
In order to use this command make sure you have the [[AnnotationExtension
]] added to your editor.
Signature:
setAnnotations(annotations: Array<OmitText<Type>>): CommandFunction;
Parameters:
Parameter | Type | Description |
---|---|---|
annotations | Array<OmitText<Type>> | the initial annotation to be set. |
Returns:
CommandFunction
method updateAnnotation
Updates an existing annotation with a new value.
In order to use this command make sure you have the [[AnnotationExtension
]] added to your editor.
Signature:
updateAnnotation(id: string, annotationDataWithoutId: Omit<OmitTextAndPosition<Type>, 'id'>): CommandFunction;
Parameters:
Parameter | Type | Description |
---|---|---|
id | string | the annotation id to update. |
annotationDataWithoutId | Omit<OmitTextAndPosition<Type>, 'id'> | the annotation data without the id. |
Returns:
CommandFunction
function createCenteredAnnotationPositioner()
Render a positioner which captures the selected annotation.
Signature:
export declare function createCenteredAnnotationPositioner(getAnnotationsAt: GetAnnotationsAt): Positioner<{
from: Coords;
to: Coords;
}>;
Parameters:
Parameter | Type | Description |
---|---|---|
getAnnotationsAt | GetAnnotationsAt |
Returns:
Positioner<{ from: Coords; to: Coords; }>
Remarks:
This extends the selection positioner. The difference is that the from and to coordinates are picked from shortest annotation selected.
interface Annotation
Signature:
export interface Annotation
property className
Classname added to the annotation when it's rendered. This can be used e.g. to have annotations in different colors
Signature:
className?: string;
property from
Document position where the annotation starts.
Signature:
from: number;
property id
Unique identifier of the annotation
Signature:
id: string;
property text
Plain text of what is annotated, i.e. content between from->start. This allows applications fetching the annotation to work with them without having to query Prosemirror for the text.
Signature:
text: string;
property to
Document position where the annotation ends.
Signature:
to: number;
interface AnnotationOptions
Signature:
export interface AnnotationOptions<Type extends Annotation = Annotation> extends ObsoleteOptions<ExternalMapOptions<Type>>
Extends: ObsoleteOptions<ExternalMapOptions<Type>>
(Some inherited members may not be shown because they are not represented in the documentation.)
property blockSeparator
Allows to format the text returned for each annotation.
When blockSeparator
is given, it will be inserted whenever a new block node is started.
Signature:
blockSeparator?: AcceptUndefined<string>;
property getStore
Signature:
getStore?: () => AnnotationStore<Type>;
property getStyle
Method to calculate styles for a segment with one or more annotations
Signature:
getStyle?: GetStyle<Type>;
Remarks:
This can be used e.g. to assign different shades of a color depending on the amount of annotations in a segment.
interface AnnotationStore
Signature:
export interface AnnotationStore<Type extends Annotation>
property addAnnotation
Signature:
addAnnotation: (data: OmitText<Type>) => void;
property formatAnnotations
Signature:
formatAnnotations: () => Array<OmitText<Type>>;
property removeAnnotations
Signature:
removeAnnotations: (ids: string[]) => void;
property setAnnotations
Signature:
setAnnotations: (annotations: Array<OmitText<Type>>) => void;
property updateAnnotation
Signature:
updateAnnotation: (id: string, updateData: OmitTextAndPosition<Type>) => void;
type OmitText
Remove the text field from an annotation.
Signature:
export type OmitText<Type extends Annotation> = Omit<Type, 'text'>;
References: Annotation
type OmitTextAndPosition
Get the data of the annotation without the fields managed by ProseMirror.
Signature:
export type OmitTextAndPosition<Type extends Annotation> = Omit<Type, 'text' | 'from' | 'to'>;
References: Annotation