@knaw-huc/osd-iiif-viewer 0.1.5 → 0.1.7

package/README.md

@@ -1,14 +1,15 @@
 # @knaw-huc/osd-iiif-viewer
 
-React wrapper around OpenSeadragon to display and browse image sources from iiif manifests.
+Lightweight React wrapper around OpenSeadragon to display and browse image sources from IIIF manifests.
 
-Current features (WIP):
+Features:
 - Canvas navigation
 - Highlight overlay
 - Zoom and fullscreen controls
-- Manifest parsing (iiif manifests v3, ImageService2)
+- IIIF manifest loading
+
+## Example
 
-## Minimal example
 ```tsx
 import {useEffect} from 'react';
 import {
@@ -20,27 +21,28 @@ import {
 
 export function Example() {
   return <ViewerProvider>
-    <View/>
+    <MyOsdIiifView/>
   </ViewerProvider>
 }
 
-function View() {
+function MyOsdIiifView() {
   const loadManifest = useLoadManifest();
-  const manifest = useManifest();
+  const {isReady} = useManifest();
 
   useEffect(() => {
     loadManifest('/manifest.json');
   }, [loadManifest]);
 
-  if (!manifest.data) {
+  if (!isReady) {
     return null;
   }
 
   return (
     <div style={{width: '100%', height: '100vh'}}>
-      <Viewerer/>
+      <Viewer/>
     </div>
   );
 }
 ```
 
+For more examples, run `npm i && npm start` and open http://localhost:5173

package/dist/ControlSlice.d.ts

@@ -1,11 +1,14 @@
 import { StateCreator } from 'zustand/vanilla';
 import { ViewerStore } from './ViewerStore.ts';
-export type ControlSlice = {
+import { Resettable } from './Resettable.ts';
+export type ControlState = {
     zoomLevel: number | null;
     zoomMin: number | null;
     zoomMax: number | null;
     isFullPage: boolean;
     rotation: number;
+};
+export type ControlSlice = Resettable & ControlState & {
     setZoomLevel: (zoomLevel: number | null) => void;
     setZoomMin: (zoomMin: number | null) => void;
     setZoomMax: (zoomMax: number | null) => void;

package/dist/InstanceSlice.d.ts

@@ -1,9 +1,12 @@
 import { StateCreator } from 'zustand/vanilla';
 import { default as OpenSeadragon } from 'openseadragon';
 import { ViewerStore } from './ViewerStore.ts';
-export type InstanceSlice = {
+import { Resettable } from './Resettable.ts';
+export type InstanceState = {
     viewer: OpenSeadragon.Viewer | null;
     viewerReady: boolean;
+};
+export type InstanceSlice = Resettable & InstanceState & {
     setViewer: (viewer: OpenSeadragon.Viewer | null) => void;
     setViewerReady: (viewerReady: boolean) => void;
 };

package/dist/Resettable.d.ts

@@ -0,0 +1,3 @@
+export type Resettable = {
+    reset: () => void;
+};

package/dist/ViewerStore.d.ts

@@ -2,5 +2,6 @@ import { InstanceSlice } from './InstanceSlice.ts';
 import { ControlSlice } from './ControlSlice.ts';
 import { ManifestSlice } from './manifest/ManifestSlice.ts';
 import { CanvasSlice } from './manifest/CanvasSlice.ts';
-export type ViewerStore = InstanceSlice & ControlSlice & ManifestSlice & CanvasSlice;
+import { Resettable } from './Resettable.ts';
+export type ViewerStore = InstanceSlice & ControlSlice & ManifestSlice & CanvasSlice & Resettable;
 export declare const createViewerStore: () => import('zustand').StoreApi<ViewerStore>;

package/dist/index.d.ts

@@ -8,4 +8,7 @@ export { useViewerReady } from './useViewerReady';
 export { useViewerStore } from './useViewerStore';
 export { useManifest, useLoadManifest } from './manifest/useManifest';
 export { useCanvas } from './manifest/useCanvas';
-export type { ViewerManifest, ViewerCanvas, ViewerRange, ViewerMetadata } from './manifest/model';
+export { useVault } from './manifest/useVault';
+export { findTileSource } from './manifest/findTileSource';
+export { findThumbnail } from './manifest/findThumbnail';
+export { getImageServiceId } from './manifest/getImageServiceId';