@soomo/text-annotator 3.4.14-staging.0 → 4.1.0-staging.0

package/dist/index.d.ts

@@ -1,11 +1,12 @@
-export * from './api';
-export * from './highlight';
 export * from './model';
-export * from './presence';
+export * from './rendering';
 export * from './state';
-export * from './utils';
-export * from './SelectionHandler';
-export * from './TextAnnotator';
-export * from './TextAnnotatorOptions';
+export * from './utils/annotation';
+export * from './utils/dom';
+export * from './utils/events';
+export * from './utils/highlight';
+export * from './selection-handler';
+export * from './text-annotator';
+export * from './text-annotator-options';
 export type { Annotation, AnnotationBody, AnnotationTarget, Annotator, AnnotatorState, Color, Filter, FormatAdapter, HoverState, Selection, SelectionState, Store, StoreChangeEvent, StoreObserver, ParseResult, User, UserSelectActionExpression, ViewportState, W3CAnnotation, W3CAnnotationBody, W3CAnnotationTarget } from '@annotorious/core';
 export { createBody, Origin, UserSelectAction } from '@annotorious/core';

package/dist/model/core/index.d.ts

@@ -1 +1 @@
-export * from './TextAnnotation';
+export * from './text-annotation';

package/dist/model/core/text-annotation.d.ts

@@ -0,0 +1,27 @@
+import type { Annotation, AnnotationTarget } from '@annotorious/core';
+export interface TextAnnotation extends Annotation {
+    target: TextAnnotationTarget;
+}
+export interface TextAnnotationTarget extends AnnotationTarget {
+    selector: TextSelector[];
+}
+export interface TextSelector {
+    id?: string;
+    quote: string;
+    start: number;
+    end: number;
+    range: Range;
+    offsetReference?: HTMLElement;
+}
+export interface TextAnnotationLike extends Annotation {
+    target: TextAnnotationTargetLike;
+}
+export interface TextAnnotationTargetLike extends AnnotationTarget {
+    selector: TextSelectorLike[];
+}
+export interface TextSelectorLike {
+    id?: string;
+    quote: string;
+    range: Range;
+    offsetReference?: HTMLElement;
+}

package/dist/model/w3c/index.d.ts

@@ -1,2 +1,2 @@
-export * from './W3CTextAnnotation';
-export * from './W3CTextFormatAdapter';
+export * from './w3c-text-annotation';
+export * from './w3c-text-format-adapter';

package/dist/model/w3c/w3c-text-annotation.d.ts

@@ -0,0 +1,36 @@
+import type { W3CAnnotation, W3CAnnotationTarget } from '@annotorious/core';
+export interface W3CTextAnnotation extends W3CAnnotation {
+    target: W3CTextAnnotationTarget | W3CTextAnnotationTarget[];
+    stylesheet?: W3CAnnotationStylesheet;
+}
+export interface W3CTextAnnotationTarget extends W3CAnnotationTarget {
+    selector: W3CTextSelector | W3CTextSelector[];
+    styleClass?: string;
+    scope?: string;
+    outdated?: boolean;
+    migrationPending?: boolean;
+}
+/**
+ * Matches the `Text Quote Selector` spec
+ * @see https://www.w3.org/TR/annotation-model/#text-quote-selector
+ */
+export interface W3CTextQuoteSelector {
+    type: 'TextQuoteSelector';
+    exact: string;
+    prefix?: string;
+    suffix?: string;
+}
+/**
+ * Matches the `Text Position Selector` spec
+ * @see https://www.w3.org/TR/annotation-model/#text-position-selector
+ */
+export interface W3CTextPositionSelector {
+    type: 'TextPositionSelector';
+    start: number;
+    end: number;
+}
+export type W3CTextSelector = W3CTextQuoteSelector | W3CTextPositionSelector;
+export type W3CAnnotationStylesheet = string | {
+    type: 'CssStylesheet';
+    value: string;
+};

package/dist/model/w3c/w3c-text-format-adapter.d.ts

@@ -0,0 +1,12 @@
+import type { TextAnnotation } from '../core';
+import type { W3CTextAnnotation } from './';
+import { type FormatAdapter, type ParseResult } from '@annotorious/core';
+export type W3CTextFormatAdapter<I extends TextAnnotation = TextAnnotation, E extends W3CTextAnnotation = W3CTextAnnotation> = FormatAdapter<I, E>;
+/**
+ * @param source - the IRI of the annotated content
+ * @param container - the HTML container of the annotated content,
+ *                    Required to locate the content's `range` within the DOM
+ */
+export declare const W3CTextFormat: <I extends TextAnnotation = TextAnnotation, E extends W3CTextAnnotation = W3CTextAnnotation>(source: string, container?: HTMLElement) => W3CTextFormatAdapter<I, E>;
+export declare const parseW3CTextAnnotation: <I extends TextAnnotation = TextAnnotation, E extends W3CTextAnnotation = W3CTextAnnotation>(annotation: E) => ParseResult<I>;
+export declare const serializeW3CTextAnnotation: <I extends TextAnnotation = TextAnnotation, E extends W3CTextAnnotation = W3CTextAnnotation>(annotation: I, source: string, container?: HTMLElement) => E;

package/dist/rendering/base-renderer.d.ts

@@ -0,0 +1,31 @@
+import { type Unsubscribe } from 'nanoevents';
+import { type Annotation, type AnnotatorState, type Filter, type ViewportState } from '@annotorious/core';
+import type { TextAnnotation } from '../model';
+import type { TextAnnotatorState } from '../state';
+import { type Highlight, type HighlightStyleExpression, type ViewportBounds } from './';
+/**
+ * The renderer runtime interface.
+ */
+export interface Renderer {
+    destroy(): void;
+    on: <E extends keyof RendererEvents>(event: E, callback: RendererEvents[E]) => Unsubscribe;
+    redraw(force?: boolean): void;
+    setStyle(style?: HighlightStyleExpression, id?: string): void;
+    setFilter(filter?: Filter<any>): void;
+    setVisible(visible: boolean): void;
+}
+export interface RendererEvents {
+    onRedraw(): void;
+}
+export type RendererFactory<T extends Annotation> = (container: HTMLElement, state: AnnotatorState<T, any>, viewport: ViewportState) => Renderer;
+/**
+ * A utility interface. Instead of implementing a Renderer from scratch,
+ * implementers can simply implement a painter, and wrap it in the
+ * BaseRenderer, which will handle common concerns.
+ */
+export interface Painter {
+    destroy(): void;
+    redraw(highlights: Highlight[], bounds: ViewportBounds, style?: HighlightStyleExpression, styleOverrides?: Map<string, HighlightStyleExpression>, force?: boolean): void;
+    setVisible(visible: boolean): void;
+}
+export declare const createRenderer: <T extends TextAnnotatorState = TextAnnotatorState<TextAnnotation, any>>(painter: Painter, container: HTMLElement, state: T, viewport: ViewportState) => Renderer;

package/dist/rendering/highlight-style.d.ts

@@ -0,0 +1,14 @@
+import type { AnnotationState, Color, DrawingStyle } from '@annotorious/core';
+import type { TextAnnotation } from '../model';
+import type { Highlight } from './';
+export interface HighlightStyle extends Pick<DrawingStyle, 'fill' | 'fillOpacity'> {
+    underlineStyle?: string;
+    underlineColor?: Color;
+    underlineOffset?: number;
+    underlineThickness?: number;
+}
+export type HighlightStyleExpression = HighlightStyle | (<I extends TextAnnotation = TextAnnotation>(annotation: I, state: AnnotationState, zIndex?: number) => HighlightStyle | undefined);
+export declare const DEFAULT_STYLE: HighlightStyle;
+export declare const DEFAULT_SELECTED_STYLE: HighlightStyle;
+export declare const getBackgroundColor: (style?: HighlightStyle) => string;
+export declare const computeStyle: (highlight: Highlight, style?: HighlightStyleExpression, z?: number) => HighlightStyle;

package/dist/rendering/highlight.d.ts

@@ -0,0 +1,6 @@
+import type { AnnotationState } from '@annotorious/core';
+import type { TextAnnotation } from '../model';
+import type { AnnotationRects } from '../state';
+export interface Highlight extends AnnotationRects<TextAnnotation> {
+    state: AnnotationState;
+}

package/dist/rendering/index.d.ts

@@ -0,0 +1,5 @@
+export * from './base-renderer';
+export * from './highlight';
+export * from './highlight-style';
+export * from './renderer-spans';
+export * from './viewport';

package/dist/rendering/renderer-css-highlight/css-highlight-renderer.d.ts

@@ -0,0 +1,7 @@
+import type { TextAnnotation } from '../../model';
+import { type Painter, type RendererFactory } from '../';
+/**
+ * EXPERIMENTAL!
+ */
+export declare const createCSSHighlightPainter: () => Painter;
+export declare const createCSSHighlightRenderer: RendererFactory<TextAnnotation>;

package/dist/rendering/renderer-css-highlight/index.d.ts

@@ -0,0 +1 @@
+export * from './css-highlight-renderer';

package/dist/rendering/renderer-spans/index.d.ts

@@ -0,0 +1 @@
+export * from './spans-renderer';

package/dist/rendering/renderer-spans/spans-renderer.d.ts

@@ -0,0 +1,4 @@
+import type { TextAnnotation } from '../../model';
+import { type RendererFactory } from '../';
+import './spans-renderer.css';
+export declare const createSpansRenderer: RendererFactory<TextAnnotation>;

package/dist/rendering/viewport.d.ts

@@ -0,0 +1,12 @@
+import type { ViewportState } from '@annotorious/core';
+import type { TextAnnotation } from '../model';
+export interface ViewportBounds {
+    top: number;
+    left: number;
+    minX: number;
+    minY: number;
+    maxX: number;
+    maxY: number;
+}
+export declare const getViewportBounds: (container: HTMLElement) => ViewportBounds;
+export declare const trackViewport: (viewport: ViewportState) => (annotations: TextAnnotation[]) => void;

package/dist/selection-handler.d.ts

@@ -0,0 +1,12 @@
+import type { Filter, Lifecycle, User } from '@annotorious/core';
+import type { TextAnnotatorState } from './state';
+import type { TextAnnotation } from './model';
+import type { AnnotatingMode } from './text-annotator';
+import type { TextAnnotatorOptions } from './text-annotator-options';
+export declare const createSelectionHandler: <T extends TextAnnotation>(container: HTMLElement, state: TextAnnotatorState<TextAnnotation, any>, lifecycle: Lifecycle<TextAnnotation, any>, options: TextAnnotatorOptions<TextAnnotation, any>) => {
+    destroy: () => void;
+    setFilter: (filter?: Filter<any>) => Filter<any>;
+    setUser: (user?: User) => User;
+    setAnnotatingEnabled: (enabled: boolean) => void;
+    setAnnotatingMode: (mode?: AnnotatingMode) => AnnotatingMode;
+};

package/dist/state/index.d.ts

@@ -1,2 +1,2 @@
-export * from './TextAnnotationStore';
-export * from './TextAnnotatorState';
+export * from './text-annotation-store';
+export * from './text-annotator-state';

package/dist/state/spatial-tree.d.ts

@@ -0,0 +1,33 @@
+import type { Store } from '@annotorious/core';
+import { type Unsubscribe } from 'nanoevents';
+import type { TextAnnotationLike, TextAnnotationTarget } from '../model';
+import type { AnnotationRects } from '../state/text-annotation-store';
+interface IndexedHighlightRect {
+    minX: number;
+    minY: number;
+    maxX: number;
+    maxY: number;
+    annotation: {
+        id: string;
+        rects: DOMRect[];
+    };
+}
+export interface SpatialTreeEvents {
+    recalculate(): void;
+}
+export declare const createSpatialTree: <T extends TextAnnotationLike>(store: Store<T>, container: HTMLElement, hMergeTolerance?: number, vMergeTolerance?: number) => {
+    all: () => IndexedHighlightRect[][];
+    clear: () => void;
+    getAt: (x: number, y: number, all?: boolean) => string[];
+    getAnnotationBounds: (id: string) => DOMRect | undefined;
+    getAnnotationRects: (id: string) => DOMRect[];
+    getIntersecting: (minX: number, minY: number, maxX: number, maxY: number) => AnnotationRects<T>[];
+    insert: (target: TextAnnotationTarget) => void;
+    recalculate: () => void;
+    remove: (target: TextAnnotationTarget) => void;
+    set: (targets: TextAnnotationTarget[], replace?: boolean) => void;
+    size: () => number;
+    update: (target: TextAnnotationTarget) => void;
+    on: <E extends keyof SpatialTreeEvents>(event: E, callback: SpatialTreeEvents[E]) => Unsubscribe;
+};
+export {};

package/dist/state/text-annotation-store.d.ts

@@ -0,0 +1,28 @@
+import type { Unsubscribe } from 'nanoevents';
+import type { Filter, Origin, Store } from '@annotorious/core';
+import type { TextAnnotation, TextAnnotationLike } from '../model';
+import type { SpatialTreeEvents } from '../state/spatial-tree';
+export interface TextAnnotationStore<T extends TextAnnotationLike = TextAnnotation> extends Omit<Store<T>, 'addAnnotation' | 'bulkAddAnnotations' | 'bulkUpsertAnnotations'> {
+    addAnnotation(annotation: T, origin?: Origin): boolean;
+    bulkAddAnnotations(annotations: T[], replace: boolean, origin?: Origin): T[];
+    bulkUpsertAnnotations(annotations: T[], origin?: Origin): T[];
+    getAnnotationRects(id: string): DOMRect[];
+    getAnnotationBounds(id: string): DOMRect | undefined;
+    getAnnotationRects(id: string): DOMRect[];
+    getAt(x: number, y: number, all: true, filter?: Filter): T[] | undefined;
+    getAt(x: number, y: number, all: false, filter?: Filter): T | undefined;
+    getAt(x: number, y: number, all?: boolean, filter?: Filter): T | T[] | undefined;
+    getIntersecting(minX: number, minY: number, maxX: number, maxY: number): AnnotationRects<T>[];
+    recalculatePositions(): void;
+    onRecalculatePositions(callback: SpatialTreeEvents['recalculate']): Unsubscribe;
+}
+export interface AnnotationRects<T extends TextAnnotationLike = TextAnnotation> {
+    annotation: T;
+    rects: Rect[];
+}
+export interface Rect {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}

package/dist/state/text-annotator-state.d.ts

@@ -0,0 +1,12 @@
+import type { ViewportState } from '@annotorious/core';
+import type { AnnotatorState, SelectionState, HoverState } from '@annotorious/core';
+import type { TextAnnotation, TextAnnotationLike } from '../model';
+import type { TextAnnotationStore } from '../state/text-annotation-store';
+import type { TextAnnotatorOptions } from '../text-annotator-options';
+export interface TextAnnotatorState<I extends TextAnnotationLike = TextAnnotation, E extends unknown = TextAnnotation> extends Omit<AnnotatorState<I, E>, 'store'> {
+    store: TextAnnotationStore<I>;
+    selection: SelectionState<I, E>;
+    hover: HoverState<I>;
+    viewport: ViewportState;
+}
+export declare const createTextAnnotatorState: <I extends TextAnnotation = TextAnnotation, E extends unknown = TextAnnotation>(container: HTMLElement, opts: TextAnnotatorOptions<I, E>) => TextAnnotatorState<I, E>;

package/dist/text-annotator-options.d.ts

@@ -0,0 +1,33 @@
+import type { FormatAdapter, UserSelectActionExpression, User } from '@annotorious/core';
+import type { HighlightStyleExpression, RendererFactory } from './rendering';
+import type { TextAnnotation, TextAnnotationLike } from './model';
+export interface TextAnnotatorOptions<I extends TextAnnotationLike = TextAnnotation, E extends unknown = TextAnnotation> {
+    adapter?: FormatAdapter<I, E>;
+    allowModifierSelect?: boolean;
+    annotatingEnabled?: boolean;
+    /**
+     * Determines whether an active selection should be dismissed
+     * when a user ends their interaction (click, selection)
+     * on a non-annotatable element.
+     * - NEVER - don't dismiss the selection, ignore the action.
+     * - ALWAYS - dismiss the selection.
+     * - function - a custom matcher that takes an event and container as arguments.
+     *              Returns `true` if the selection should be dismissed.
+     *
+     * @defaut NEVER
+     */
+    dismissOnNotAnnotatable?: DismissOnNotAnnotatableExpression;
+    mergeHighlights?: {
+        horizontalTolerance?: number;
+        verticalTolerance?: number;
+    };
+    offsetReferenceSelector?: string;
+    renderer?: RendererType | RendererFactory<I>;
+    selectionMode?: 'shortest' | 'all';
+    style?: HighlightStyleExpression;
+    user?: User;
+    userSelectAction?: UserSelectActionExpression<E>;
+}
+export type RendererType = 'SPANS' | 'CSS_HIGHLIGHTS';
+export type DismissOnNotAnnotatableExpression = 'NEVER' | 'ALWAYS' | ((event: Event, container: HTMLElement) => boolean);
+export declare const fillDefaults: <I extends TextAnnotationLike = TextAnnotation, E extends unknown = TextAnnotation>(opts: TextAnnotatorOptions<I, E>, defaults: TextAnnotatorOptions<I, E>) => TextAnnotatorOptions<I, E>;

package/dist/text-annotator.css

@@ -1 +1 @@
-.r6o-canvas-highlight-layer{position:fixed;top:0;bottom:0;left:0;width:100vw;height:100vh;pointer-events:none}.r6o-canvas-highlight-layer.bg{mix-blend-mode:multiply;z-index:1}.r6o-annotatable .r6o-span-highlight-layer{position:absolute;top:0;left:0;width:100%;height:100%;mix-blend-mode:multiply;pointer-events:none;overflow:hidden;user-select:none;-webkit-user-select:none;z-index:1}.r6o-annotatable .r6o-span-highlight-layer.hidden{display:none}.r6o-annotatable .r6o-span-highlight-layer .r6o-annotation{position:absolute;display:block;border-style:solid;border-width:0;box-sizing:content-box}.r6o-presence-layer{left:0;position:fixed;top:0;bottom:0;width:100vw;pointer-events:none}html,body{overscroll-behavior-y:none}.r6o-annotatable{position:relative;-webkit-tap-highlight-color:transparent}.r6o-annotatable.no-focus-outline{outline:none}.hovered *{cursor:pointer}*::selection,::selection{background:#0080ff2e}::-moz-selection{background:#0080ff2e}
+.r6o-annotatable .r6o-span-highlight-layer{position:absolute;top:0;left:0;width:100%;height:100%;mix-blend-mode:multiply;pointer-events:none;overflow:hidden;user-select:none;-webkit-user-select:none;z-index:1}.r6o-annotatable .r6o-span-highlight-layer.hidden{display:none}.r6o-annotatable .r6o-span-highlight-layer .r6o-annotation{position:absolute;display:block;border-style:solid;border-width:0;box-sizing:content-box}html,body{overscroll-behavior-y:none}.r6o-annotatable{position:relative;-webkit-tap-highlight-color:transparent}.r6o-annotatable.no-focus-outline{outline:none}.hovered *{cursor:pointer}*::selection,::selection{background:#0080ff2e}::-moz-selection{background:#0080ff2e}

package/dist/text-annotator.d.ts

@@ -0,0 +1,17 @@
+import { type Annotator } from '@annotorious/core';
+import type { HighlightStyleExpression, Renderer } from './rendering';
+import type { TextAnnotation, TextAnnotationLike } from './model';
+import { type TextAnnotatorState } from './state';
+import { type TextAnnotatorOptions } from './text-annotator-options';
+import './text-annotator.css';
+export interface TextAnnotator<I extends TextAnnotationLike = TextAnnotation, E extends unknown = TextAnnotation> extends Omit<Annotator<I, E>, 'setStyle' | 'state'> {
+    element: HTMLElement;
+    renderer: Renderer;
+    setStyle(style?: HighlightStyleExpression, id?: string): void;
+    scrollIntoView(annotationOrId: I | string, scrollParentOrId?: string | Element): boolean;
+    setAnnotatingEnabled(enabled?: boolean): void;
+    setAnnotatingMode(mode?: AnnotatingMode): void;
+    state: TextAnnotatorState<I, E>;
+}
+export type AnnotatingMode = 'CREATE_NEW' | 'ADD_TO_CURRENT' | 'REPLACE_CURRENT';
+export declare const createTextAnnotator: <I extends TextAnnotationLike = TextAnnotation, E extends unknown = TextAnnotation>(container: HTMLElement, options?: TextAnnotatorOptions<I, E>) => TextAnnotator<I, E>;