Add Viewer plugin support

.gitignore

@@ -17,4 +17,8 @@ html/
 
 # VSCode
 .vscode/
+
+dist/tsconfig.tsbuildinfo
 tmp
+.env.local
+tsconfig.tsbuildinfo

build/build.mjs

@@ -11,7 +11,7 @@ const buildOptions = {
  entry: "./src/components/Image/index.tsx",
  fileName: "index",
  },
- }, 
+ },
  primitives: {
  lib: {
  name: "CloverIIIFPrimitives",
@@ -38,6 +38,20 @@ const buildOptions = {
  name: "CloverIIIFScroll",
  entry: "./src/components/Scroll/index.tsx",
  fileName: "index",
+ }
+ },
+ 'annotation-helpers': {
+ lib: {
+ name: "CloverIIIFAnnotationHelpers",
+ entry: "./src/lib/annotation-helpers.ts",
+ fileName: "index",
+ },
+ },
+ 'openseadragon-helpers': {
+ lib: {
+ name: "CloverIIIFOpenseadragonHelpers",
+ entry: "./src/lib/openseadragon-helpers.ts",
+ fileName: "index",
  },
  },
 };

build/root.mjs

@@ -3,7 +3,19 @@ import Primitives from "./primitives";
 import Scroll from "./scroll";
 import Slider from "./slider";
 import Viewer from "./viewer";
+import {
+ parseAnnotationTarget,
+} from "./annotation-helpers";
+import { createOpenSeadragonRect } from "./openseadragon-helpers";
 
-export { Image, Primitives, Scroll, Slider, Viewer };
+export {
+ Image,
+ Primitives,
+ Scroll,
+ Slider,
+ Viewer,
+ parseAnnotationTarget,
+ createOpenSeadragonRect
+};
 
-export default Viewer; 
+export default Viewer;

build/root.umd.js

@@ -5,6 +5,10 @@ const Primitives = require("./primitives");
 const Scroll = require("./scroll");
 const Slider = require("./slider");
 const Viewer = require("./viewer");
+const {
+ parseAnnotationTarget,
+} = require("./annotation_helpers");
+const { createOpenSeadragonRect } = require("./openseadragon-helpers");
 
 module.exports = {
  default: Viewer,
@@ -13,4 +17,6 @@ module.exports = {
  Scroll,
  Slider,
  Viewer,
+ parseAnnotationTarget,
+ createOpenSeadragonRect
 };

docs/components/DynamicImports/Viewer.tsx

@@ -1,6 +1,7 @@
 import {
  type CustomDisplay,
  ViewerConfigOptions,
+ PluginConfig,
 } from "src/context/viewer-context";
 import dynamic from "next/dynamic";
 import { isDark } from "docs/lib/theme";
@@ -20,11 +21,13 @@ const CloverViewer = ({
  options,
  customDisplays,
  iiifContentSearchQuery,
+ plugins,
 }: {
  iiifContent: string;
  options?: ViewerConfigOptions;
  customDisplays?: Array<CustomDisplay>;
  iiifContentSearchQuery?: ContentSearchQuery;
+ plugins?: Array<PluginConfig>;
 }) => {
  const router = useRouter();
  const iiifResource = router.query["iiif-content"]
@@ -40,6 +43,7 @@ const CloverViewer = ({
  options={{ ...options, background }}
  key={iiifResource}
  {...(customDisplays && { customDisplays })}
+ {...(plugins && { plugins })}
  />
  );
 };