react-iiif-vault 1.1.1 → 1.2.1

package/dist/bundle.d.ts

@@ -10,9 +10,13 @@ import { BoxSelector, TemporalBoxSelector, TemporalSelector } from '@iiif/helper
 export * from '@iiif/helpers/annotation-targets';
 import { ImageCandidate, RegionParameter, RotationParameter, SizeParameter, ImageServiceLoader, ImageCandidateRequest } from '@atlas-viewer/iiif-image-api';
 import { Vault, VaultOptions, NormalizedEntity, IIIFStore } from '@iiif/helpers/vault';
+import * as polygon_editor from 'polygon-editor';
+import { RenderState, InputShape, SlowState } from 'polygon-editor';
 import * as zustand_vanilla from 'zustand/vanilla';
 import { StoreApi } from 'zustand/vanilla';
 import * as zustand from 'zustand';
+import * as mitt from 'mitt';
+import { Handler } from 'mitt';
 import * as _iiif_helpers_painting_annotations from '@iiif/helpers/painting-annotations';
 import { Paintables as Paintables$1 } from '@iiif/helpers/painting-annotations';
 import { VaultZustandStore } from '@iiif/helpers/vault/store';
@@ -451,6 +455,177 @@ interface SingleCanvasThumbnailProps {
 }
 declare function SingleCanvasThumbnail(props: SingleCanvasThumbnailProps): react_jsx_runtime.JSX.Element;
 
+interface SvgEditorOptions {
+    image: {
+        height: number;
+        width: number;
+    };
+    currentShape: InputShape | null;
+    onChange: (e: InputShape) => void;
+    hideShapeLines?: boolean;
+}
+declare function useSvgEditor(options: SvgEditorOptions, deps: any[]): {
+    helper: {
+        draw: {
+            enable(): void;
+            disable(): void;
+            toggle(): void;
+        };
+        state: RenderState;
+        modifiers: {
+            reset(): void;
+            getForType(type: string | null): Record<string, string>;
+            set(modifier: string): void;
+            unset(modifier: string): void;
+        };
+        stamps: {
+            set(selectedStamp: InputShape | null): void;
+            clear(): void;
+            square(): void;
+            triangle(): void;
+            pentagon(): void;
+            hexagon(): void;
+        };
+        key: {
+            down(key: string): true | undefined;
+            up(key: string): void;
+        };
+        setScale: (scale: number) => void;
+        clock: {
+            set: (renderFunc: polygon_editor.RenderFunc) => void;
+            start: (renderFunc?: polygon_editor.RenderFunc | undefined, setStateFunc?: polygon_editor.SetState | undefined) => void;
+            stop: () => void;
+            step: (deltaTime?: number | undefined) => void;
+        };
+        pointer: (pointers: ([number, number] | [number, number, number, number, number, number])[]) => void;
+        blur: () => void;
+        pointerDown: () => void;
+        pointerUp: () => void;
+        setShape: (shape: InputShape | null) => void;
+        modes: {
+            toggleLineBoxMode: () => void;
+            toggleLineMode: () => void;
+            enableLineMode(): void;
+            disableLineMode(): void;
+            enableLineBoxMode(): void;
+            disableLineBoxMode(): void;
+        };
+        label: (type: string | null) => string;
+    };
+    state: SlowState;
+    isAddingPoint: boolean;
+    isSplitting: boolean;
+    isStamping: boolean | null;
+    isHoveringPoint: boolean;
+    transitionDirection: string | null;
+    transitionRotate: boolean;
+    defs: react_jsx_runtime.JSX.Element;
+    editor: react_jsx_runtime.JSX.Element | null;
+};
+
+type HelperType$1 = ReturnType<typeof useSvgEditor>['helper'];
+type StateType$1 = ReturnType<typeof useSvgEditor>['state'];
+interface RenderSvgEditorControlsProps {
+    helper: HelperType$1;
+    state: StateType$1;
+    showShapes: boolean;
+    classNames?: Partial<{
+        button: string;
+    }>;
+    enabled?: {
+        draw?: boolean;
+        polygon?: boolean;
+        line?: boolean;
+        lineBox?: boolean;
+        square?: boolean;
+        triangle?: boolean;
+        hexagon?: boolean;
+        circle?: boolean;
+        delete?: boolean;
+    };
+    icons?: Partial<{
+        DrawIcon: ReactNode;
+        PolygonIcon: ReactNode;
+        LineIcon: ReactNode;
+        LineBoxIcon: ReactNode;
+        ShapesIcon: ReactNode;
+        SquareIcon: ReactNode;
+        TriangleIcon: ReactNode;
+        HexagonIcon: ReactNode;
+        CircleIcon: ReactNode;
+        DeleteForeverIcon: ReactNode;
+    }>;
+}
+declare function RenderSvgEditorControls({ helper, showShapes, state, enabled, classNames, icons, }: RenderSvgEditorControlsProps): react_jsx_runtime.JSX.Element;
+
+declare const svgThemes: ({
+    name: string;
+    outer: {
+        borderWidth: number;
+        borderColor: string;
+    };
+    inner: {
+        borderWidth: number;
+        borderColor: string;
+    };
+} | {
+    name: string;
+    outer: {
+        borderWidth: string;
+        borderColor: string;
+    };
+    inner: {
+        borderWidth: string;
+        borderColor: string;
+    };
+} | {
+    name: string;
+    outer: {
+        borderWidth: string;
+        borderColor: string;
+    };
+    inner: {
+        borderWidth?: undefined;
+        borderColor?: undefined;
+    };
+})[];
+type HelperType = ReturnType<typeof useSvgEditor>['helper'];
+type StateType = ReturnType<typeof useSvgEditor>['state'];
+type SvgTheme = {
+    name?: string;
+    outer: BoxStyle;
+    inner: BoxStyle;
+};
+interface CreateCustomShapeProps {
+    image: {
+        width: number;
+        height: number;
+    };
+    shape?: any;
+    updateShape: any;
+    theme?: {
+        name?: string;
+        outer: BoxStyle;
+        inner: BoxStyle;
+    };
+    controlsHtmlId?: string;
+    renderControls?: (helper: HelperType, state: StateType, showShapes: boolean) => any;
+}
+declare function CreateCustomShape(props: CreateCustomShapeProps): react_jsx_runtime.JSX.Element;
+
+interface PolygonSelectorProps {
+    id: string;
+    polygon: InputShape;
+    annotationBucket?: string;
+    isHighlighted?: boolean;
+    updatePolygon?: (shape: InputShape) => void;
+    readOnly?: boolean;
+    theme?: SvgTheme;
+    controlsHtmlId?: string;
+    renderControls?: CreateCustomShapeProps['renderControls'];
+}
+declare function PolygonSelector(props: PolygonSelectorProps): react_jsx_runtime.JSX.Element | null;
+
 declare function AnnotationContext({ annotation, children }: {
     annotation: string;
     children: ReactNode;
@@ -722,6 +897,106 @@ declare function useViewerPreset(): Preset | null | undefined;
 declare const ImageServiceLoaderContext: React__default.Context<ImageServiceLoader>;
 declare function useImageServiceLoader(): ImageServiceLoader;
 
+type SelectorHelperEventTypes = 'click' | 'hover' | 'selector-updated' | 'highlight' | 'clear-highlight' | 'zoom-to' | 'event-listener' | 'remove-event-listener' | 'image-preview-request';
+declare function SelectorControllerProvider({ children }: {
+    children: ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function useSelectorEmitter(): mitt.Emitter<Record<mitt.EventType, unknown>>;
+declare function useSelectorEvents(id: string): {
+    controller: {
+        withSelector(selectorId: string): {
+            on<T extends {
+                selectorId: string;
+            } = any>(type: SelectorHelperEventTypes, handler: Handler<T>): () => void;
+            emit<T_1 = any>(type: SelectorHelperEventTypes, event: T_1): void;
+        };
+        on<T_2 extends {
+            selectorId: string;
+        } = any>(type: SelectorHelperEventTypes, handler: Handler<T_2>): () => void;
+        emit<T_3 extends {
+            selectorId: string;
+        } = any>(type: SelectorHelperEventTypes, event: T_3): void;
+    };
+    onClick: (e?: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }) => void;
+    onHover: (e?: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }) => void;
+    isHighlighted: boolean;
+};
+declare function useSelectorController(): {
+    withSelector(selectorId: string): {
+        on<T extends {
+            selectorId: string;
+        } = any>(type: SelectorHelperEventTypes, handler: Handler<T>): () => void;
+        emit<T_1 = any>(type: SelectorHelperEventTypes, event: T_1): void;
+    };
+    on<T_2 extends {
+        selectorId: string;
+    } = any>(type: SelectorHelperEventTypes, handler: Handler<T_2>): () => void;
+    emit<T_3 extends {
+        selectorId: string;
+    } = any>(type: SelectorHelperEventTypes, event: T_3): void;
+};
+declare function useSelectorHelper(): {
+    withSelector(selectorId: string): {
+        highlight(): void;
+        clearHighlight(): void;
+        zoomTo(): void;
+        addEventListener(name: string, callback: () => void): () => void;
+        getImagePreview(): Promise<any>;
+        on<T extends {
+            selectorId: string;
+        } = any>(type: SelectorHelperEventTypes, handler: Handler<T>): () => void;
+    };
+    highlight(selectorId: string): void;
+    clearHighlight(selectorId: string): void;
+    zoomTo(selectorId: string): void;
+    addEventListener(selectorId: string, name: string, callback: () => void): () => void;
+    getImagePreview(selectorId: string): Promise<any>;
+    on<T_1 extends {
+        selectorId: string;
+    } = any>(type: SelectorHelperEventTypes, handler: Handler<T_1>): () => void;
+};
+
+interface AnnotationStyles {
+    id: number;
+    name: string;
+    creator?: {
+        id: number;
+        name: string;
+    };
+    createdAt: Date;
+    theme: {
+        default: AnnotationThemeDefinition;
+        hidden: AnnotationThemeDefinition;
+        highlighted: AnnotationThemeDefinition;
+    } & Record<string, AnnotationThemeDefinition>;
+}
+type AnnotationThemeDefinition = BoxStyle & {
+    hidden?: boolean;
+    interactive?: boolean;
+    hotspot?: boolean;
+    hotspotSize?: 'lg' | 'md' | 'sm';
+};
+declare function getDefaultAnnotationStyles(): AnnotationStyles['theme'];
+declare function useAnnotationStyles(): {
+    default: AnnotationThemeDefinition;
+    hidden: AnnotationThemeDefinition;
+    highlighted: AnnotationThemeDefinition;
+} & Record<string, AnnotationThemeDefinition>;
+declare function AnnotationStyleProvider({ theme, children, }: {
+    theme?: AnnotationStyles['theme'];
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
 /**
  * Parse specific resource.
  *
@@ -954,6 +1229,57 @@ declare function VirtualAnnotationProvider({ children }: {
     children: any;
 }): react_jsx_runtime.JSX.Element;
 
+declare function usePolygonHelper(data: any, render: (t: any, s: any) => void, commitShape: (shape: InputShape) => void): {
+    state: SlowState;
+    helper: {
+        draw: {
+            enable(): void;
+            disable(): void;
+            toggle(): void;
+        };
+        state: polygon_editor.RenderState;
+        modifiers: {
+            reset(): void;
+            getForType(type: string | null): Record<string, string>;
+            set(modifier: string): void;
+            unset(modifier: string): void;
+        };
+        stamps: {
+            set(selectedStamp: InputShape | null): void;
+            clear(): void;
+            square(): void;
+            triangle(): void;
+            pentagon(): void;
+            hexagon(): void;
+        };
+        key: {
+            down(key: string): true | undefined;
+            up(key: string): void;
+        };
+        setScale: (scale: number) => void;
+        clock: {
+            set: (renderFunc: polygon_editor.RenderFunc) => void;
+            start: (renderFunc?: polygon_editor.RenderFunc | undefined, setStateFunc?: polygon_editor.SetState | undefined) => void;
+            stop: () => void;
+            step: (deltaTime?: number | undefined) => void;
+        };
+        pointer: (pointers: ([number, number] | [number, number, number, number, number, number])[]) => void;
+        blur: () => void;
+        pointerDown: () => void;
+        pointerUp: () => void;
+        setShape: (shape: InputShape | null) => void;
+        modes: {
+            toggleLineBoxMode: () => void;
+            toggleLineMode: () => void;
+            enableLineMode(): void;
+            disableLineMode(): void;
+            enableLineBoxMode(): void;
+            disableLineBoxMode(): void;
+        };
+        label: (type: string | null) => string;
+    };
+};
+
 declare function flattenAnnotationPageIds({ canvas, manifest, all, canvases, }: {
     manifest?: ManifestNormalized;
     canvas?: CanvasNormalized;
@@ -961,11 +1287,16 @@ declare function flattenAnnotationPageIds({ canvas, manifest, all, canvases, }:
     all?: boolean;
 }): string[];
 
+declare function TranslationProvider(props: {
+    translations: Record<string, string>;
+    children: ReactNode;
+}): react_jsx_runtime.JSX.Element;
 declare function LanguageProvider(props: {
     language: string;
     children: ReactNode;
 }): react_jsx_runtime.JSX.Element;
 declare function useIIIFLanguage(): string;
+declare function useTranslations(): Record<string, string>;
 type LanguageStringProps = {
     [key: string]: any;
 } & {
@@ -975,8 +1306,8 @@ type LanguageStringProps = {
 };
 declare function LanguageString({ as: Component, language, children, viewingDirection, ...props }: LanguageStringProps): react_jsx_runtime.JSX.Element;
 declare const useClosestLanguage: (getLanguages: () => string[], deps?: any[]) => string | undefined;
-declare function useLocaleString(inputText: InternationalString | string | null | undefined, defaultText?: string, separator?: string): readonly [string, string | undefined];
-declare function useCreateLocaleString(): (inputText: InternationalString | string | null | undefined, defaultText?: string, separator?: string) => string;
+declare function useLocaleString(inputText: InternationalString | string | null | undefined, defaultText?: string, separator?: string, translations?: Record<string, string>): readonly [string, string | undefined];
+declare function useCreateLocaleString(): (inputText: InternationalString | string | null | undefined, defaultText?: string, separator?: string, translations?: Record<string, string>) => string;
 type LocaleStringProps = {
     as?: string | React__default.FC<any>;
     defaultText?: string;
@@ -1056,4 +1387,4 @@ declare function findAllCanvasesInRange(vault: Vault, range: RangeNormalized): A
 declare function findManifestSelectedRange(vault: Vault, manifest: ManifestNormalized, canvasId: string): null | RangeNormalized;
 declare function findSelectedRange(vault: Vault, range: RangeNormalized, canvasId: string): null | RangeNormalized;
 
-export { AnnotationContext, AnnotationPageContext, type AnnotationPageDescription, type AudioSequence, Auth, type AuthAccessState, type AuthContextActions, type AuthContextCurrentActions, type AuthContextState, AuthProvider, AuthProvider_Old, AuthRContext, AuthReactContext, AuthReactContextActions, type AuthState, CanvasAnnotations, CanvasContext, CanvasPanel, CollectionContext, CombinedMetadata, type ComplexTimelineStrategy, ContextBridge, type EmptyStrategy, Image, type ImageProps, ImageServiceLoaderContext, type ImageServiceLoaderType, type ImageServiceRequestOptions, type ImageWithOptionalService, InnerViewerProvider, LanguageProvider, LanguageString, LocaleString, ManifestContext, ManifestMetadata, type MediaPlayerActions, MediaPlayerProvider, type MediaPlayerState, type MediaStrategy, Metadata, type MetadataProps, type ProbeStore, RangeContext, ReactVaultContext, type RenderingStrategy, type ResourceContextType, ResourceProvider, ResourceReactContext, type ResourceRequestOptions, SequenceThumbnails, type SimpleViewerActions, type SimpleViewerActionsType, type SimpleViewerContext, type SimpleViewerProps, SimpleViewerProvider, SimpleViewerReactContext, type SimpleViewerReducerState, type Single3DModelStrategy, type SingleAudio, SingleCanvasThumbnail, type SingleImageStrategy, type SingleVideo, type SingleYouTubeVideo, type StrategyActions, type TextualContentStrategy, type UnknownStrategy, type UseRenderingStrategy, type UseRenderingStrategyOptions, type VaultActivatedAnnotation, VaultProvider, type VideoSequence, ViewerPresetContext, VirtualAnnotationProvider, VisibleCanvasReactContext, authDetailsForResource, createAuthStateStore, createProbe, emptyActions, emptyStrategy, findAllCanvasesInRange, findFirstCanvasFromRange, findManifestSelectedRange, findSelectedRange, flattenAnnotationPageIds, formatTime, get3dStrategy, getImageStrategy, getManifestSequence, getParsedTargetSelector, getRenderingStrategy, getTextualContentStrategy, getVideoStrategy, getVisibleCanvasesFromCanvasId, hasAuth, makeAccessServiceRequest, makeAccessTokenRequest, parseSpecificResource, unknownResponse, unsupportedStrategy, useAnnotation, useAnnotationPage, useAnnotationPageManager, useAnnotationsAtTime, useAuthActions, useAuthActions_old, useAuthService, useAuthService_old, useAuthStore, useAuthToken, useAuthToken_old, useAuthTokens, useAuthTokens_old, useCanvas, useCanvasClock, useCanvasSequence, useCanvasSubset, useClosestLanguage, useCollection, useContextBridge, useCreateLocaleString, useCurrentAuth, useCurrentAuth_old, useDispatch, useEventListener, useExistingVault, useExternalCollection, useExternalManifest, useExternalResource, useIIIFLanguage, useImage, useImageService, useImageServiceLoader, useImageTile, useIsAuthEnabled, useLoadImageService, useLocaleString, useManifest, useMediaActions, useMediaElements, useMediaState, usePaintables, usePaintingAnnotations, useRange, useRenderingStrategy, useResourceContext, useResourceEvents, useResources, useSearchService, useSimpleMediaPlayer, useSimpleViewer, useStyleHelper, useStyles, useThumbnail, useVault, useVaultEffect, useVaultSelector, useViewerPreset, useVirtualAnnotationPage, useVirtualAnnotationPageContext, useVisibleCanvases };
+export { AnnotationContext, AnnotationPageContext, type AnnotationPageDescription, AnnotationStyleProvider, type AnnotationStyles, type AnnotationThemeDefinition, type AudioSequence, Auth, type AuthAccessState, type AuthContextActions, type AuthContextCurrentActions, type AuthContextState, AuthProvider, AuthProvider_Old, AuthRContext, AuthReactContext, AuthReactContextActions, type AuthState, CanvasAnnotations, CanvasContext, CanvasPanel, CollectionContext, CombinedMetadata, type ComplexTimelineStrategy, ContextBridge, CreateCustomShape, type CreateCustomShapeProps, type EmptyStrategy, Image, type ImageProps, ImageServiceLoaderContext, type ImageServiceLoaderType, type ImageServiceRequestOptions, type ImageWithOptionalService, InnerViewerProvider, LanguageProvider, LanguageString, LocaleString, ManifestContext, ManifestMetadata, type MediaPlayerActions, MediaPlayerProvider, type MediaPlayerState, type MediaStrategy, Metadata, type MetadataProps, PolygonSelector, type PolygonSelectorProps, type ProbeStore, RangeContext, ReactVaultContext, RenderSvgEditorControls, type RenderingStrategy, type ResourceContextType, ResourceProvider, ResourceReactContext, type ResourceRequestOptions, SelectorControllerProvider, type SelectorHelperEventTypes, SequenceThumbnails, type SimpleViewerActions, type SimpleViewerActionsType, type SimpleViewerContext, type SimpleViewerProps, SimpleViewerProvider, SimpleViewerReactContext, type SimpleViewerReducerState, type Single3DModelStrategy, type SingleAudio, SingleCanvasThumbnail, type SingleImageStrategy, type SingleVideo, type SingleYouTubeVideo, type StrategyActions, type SvgTheme, type TextualContentStrategy, TranslationProvider, type UnknownStrategy, type UseRenderingStrategy, type UseRenderingStrategyOptions, type VaultActivatedAnnotation, VaultProvider, type VideoSequence, ViewerPresetContext, VirtualAnnotationProvider, VisibleCanvasReactContext, authDetailsForResource, createAuthStateStore, createProbe, emptyActions, emptyStrategy, findAllCanvasesInRange, findFirstCanvasFromRange, findManifestSelectedRange, findSelectedRange, flattenAnnotationPageIds, formatTime, get3dStrategy, getDefaultAnnotationStyles, getImageStrategy, getManifestSequence, getParsedTargetSelector, getRenderingStrategy, getTextualContentStrategy, getVideoStrategy, getVisibleCanvasesFromCanvasId, hasAuth, makeAccessServiceRequest, makeAccessTokenRequest, parseSpecificResource, svgThemes, unknownResponse, unsupportedStrategy, useAnnotation, useAnnotationPage, useAnnotationPageManager, useAnnotationStyles, useAnnotationsAtTime, useAuthActions, useAuthActions_old, useAuthService, useAuthService_old, useAuthStore, useAuthToken, useAuthToken_old, useAuthTokens, useAuthTokens_old, useCanvas, useCanvasClock, useCanvasSequence, useCanvasSubset, useClosestLanguage, useCollection, useContextBridge, useCreateLocaleString, useCurrentAuth, useCurrentAuth_old, useDispatch, useEventListener, useExistingVault, useExternalCollection, useExternalManifest, useExternalResource, useIIIFLanguage, useImage, useImageService, useImageServiceLoader, useImageTile, useIsAuthEnabled, useLoadImageService, useLocaleString, useManifest, useMediaActions, useMediaElements, useMediaState, usePaintables, usePaintingAnnotations, usePolygonHelper, useRange, useRenderingStrategy, useResourceContext, useResourceEvents, useResources, useSearchService, useSelectorController, useSelectorEmitter, useSelectorEvents, useSelectorHelper, useSimpleMediaPlayer, useSimpleViewer, useStyleHelper, useStyles, useSvgEditor, useThumbnail, useTranslations, useVault, useVaultEffect, useVaultSelector, useViewerPreset, useVirtualAnnotationPage, useVirtualAnnotationPageContext, useVisibleCanvases };