@harvard-lts/mirador-template-plugin 0.1.7 → 0.1.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/.github/workflows/publish-package.yml +1 -1
  2. package/babel.config.json +6 -1
  3. package/demo/demoEntry.js +17 -0
  4. package/demo/index.html +23 -0
  5. package/jest.config.js +2 -2
  6. package/nwb.config.js +20 -0
  7. package/package.json +21 -5
  8. package/rollup.config.mjs +12 -0
  9. package/setupTests.js +1 -0
  10. package/src/index.js +7 -3
  11. package/src/plugins/MiradorTemplatePlugin.js +19 -51
  12. package/webpack.config.cjs +52 -0
  13. package/dist/index.js +0 -69
  14. package/dist/index.js.map +0 -1
package/.github/workflows/publish-package.yml CHANGED
@@ -31,4 +31,4 @@ jobs:
31
31
  - name: Publish to npm
32
32
  run: npm publish --access=public
33
33
  env:
34
- NODE_AUTH_TOKEN: ${{ secrets.NPM_ACCESS_TOKEN }}
34
+ NODE_AUTH_TOKEN: ${{ secrets.LTS_NPM_TOKEN }}
package/babel.config.json CHANGED
@@ -1,6 +1,11 @@
1
1
  {
2
2
  "presets": [
3
- "@babel/preset-env",
3
+ [
4
+ "@babel/preset-env",
5
+ {
6
+ "modules": "auto"
7
+ }
8
+ ],
4
9
  ["@babel/preset-react", { "runtime": "automatic" }]
5
10
  ]
6
11
  }
package/demo/demoEntry.js ADDED
@@ -0,0 +1,17 @@
1
+ import Mirador from "mirador/dist/es/src/index";
2
+ import Plugin from "../src/index";
3
+
4
+ document.addEventListener("DOMContentLoaded", () => {
5
+ const config = {
6
+ id: "mirador",
7
+ windows: [
8
+ {
9
+ manifestId: "https://nrs.lib.harvard.edu/URN-3:HUAM:925863:MANIFEST:3"
10
+ }
11
+ ]
12
+ };
13
+
14
+ const plugins = [...Plugin];
15
+
16
+ Mirador.viewer(config, plugins);
17
+ });
package/demo/index.html ADDED
@@ -0,0 +1,23 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>Test</title>
7
+ <style>
8
+ body {
9
+ margin: 0;
10
+ padding: 0;
11
+ }
12
+ #mirador {
13
+ height: 100vh;
14
+ width: 100vw;
15
+ }
16
+ </style>
17
+ <script src="demo.js"></script>
18
+ </head>
19
+ <body>
20
+ <div id="mirador"></div>
21
+ </script>
22
+ </body>
23
+ </html>
package/jest.config.js CHANGED
@@ -2,7 +2,7 @@
2
2
  module.exports = {
3
3
  testEnvironment: "jsdom",
4
4
  transformIgnorePatterns: ["node_modules/(?!mirador)/", "node_modules/pdiiif"],
5
- setupFilesAfterEnv: ["./setupTests.js"],
5
+ setupFilesAfterEnv: ["@testing-library/jest-dom", "./setupTests"],
6
6
  // collectCoverage: true,
7
7
  // coverageDirectory: "coverage",
8
8
  // verbose: true,
@@ -17,4 +17,4 @@ module.exports = {
17
17
  // },
18
18
  // },
19
19
  // // setupFiles: ["./setupTests"],
20
- };
20
+ };
package/nwb.config.js ADDED
@@ -0,0 +1,20 @@
1
+ const path = require('path');
2
+
3
+ module.exports = {
4
+ type: 'react-component',
5
+ npm: {
6
+ esModules: true,
7
+ umd: {
8
+ global: 'miradorTemplate',
9
+ externals: {
10
+ react: 'React'
11
+ }
12
+ }
13
+ },
14
+ webpack: {
15
+ aliases: {
16
+ react: path.resolve('./', 'node_modules', 'react'),
17
+ 'react-dom': path.resolve('./', 'node_modules', 'react-dom'),
18
+ },
19
+ },
20
+ }
package/package.json CHANGED
@@ -1,14 +1,17 @@
1
1
  {
2
2
  "name": "@harvard-lts/mirador-template-plugin",
3
- "version": "0.1.7",
3
+ "version": "0.1.9",
4
4
  "description": "Template for Harvard mps-viewer Mirador plugins",
5
5
  "main": "dist/index.js",
6
6
  "source": "src/index.js",
7
7
  "module": "es/index.js",
8
8
  "scripts": {
9
- "prebuild": "rm -rf dist && rm -rf es",
9
+ "clean": "rm -rf ./dist && rm -rf ./demo/dist",
10
+ "prebuild": "npm run clean",
10
11
  "prepublishOnly": "npm run build",
11
- "build": "parcel build",
12
+ "build": "run-p build:es",
13
+ "build:es": "rollup -c",
14
+ "serve": "webpack serve --mode development --open",
12
15
  "test": "jest",
13
16
  "test:coverage": "jest --coverage",
14
17
  "test:watch": "jest --watch"
@@ -22,20 +25,33 @@
22
25
  "license": "Apache-2.0",
23
26
  "homepage": "https://github.com/harvard-lts/mirador-template-plugin#readme",
24
27
  "dependencies": {
25
- "mirador": "^3.3.0",
28
+ "jquery": "^3.7.0",
29
+ "prop-types": "^15.8.1",
30
+ "react": "^16.14.0",
31
+ "react-dom": "^16.14.0",
26
32
  "redux": "^4.2.1",
27
33
  "redux-saga": "^1.2.3"
28
34
  },
29
35
  "devDependencies": {
36
+ "@babel/cli": "^7.26.4",
30
37
  "@babel/core": "^7.26.0",
31
38
  "@babel/preset-env": "^7.21.4",
32
39
  "@babel/preset-react": "^7.18.6",
40
+ "@rollup/plugin-babel": "^6.0.3",
33
41
  "@testing-library/jest-dom": "^5.16.5",
34
42
  "@testing-library/react": "^12.0.0",
35
43
  "babel-jest": "^29.7.0",
44
+ "babel-loader": "^9.1.2",
36
45
  "jest": "^30.0.2",
37
46
  "jest-environment-jsdom": "^30.0.2",
47
+ "mirador": "^3.4.3",
48
+ "npm-run-all": "^4.1.5",
38
49
  "parcel": "^2.8.3",
39
- "url": "^0.11.0"
50
+ "rollup": "^3.29.5",
51
+ "url": "^0.11.0",
52
+ "webpack": "^5.94.0",
53
+ "webpack-cli": "^5.1.4",
54
+ "webpack-dev-server": "^5.2.0",
55
+ "webpack-node-externals": "^3.0.0"
40
56
  }
41
57
  }
package/rollup.config.mjs ADDED
@@ -0,0 +1,12 @@
1
+ import { babel } from "@rollup/plugin-babel";
2
+
3
+ const config = {
4
+ input: "src/index.js",
5
+ output: {
6
+ dir: "dist/es",
7
+ format: "es",
8
+ },
9
+ plugins: [babel({ babelHelpers: "bundled" })],
10
+ };
11
+
12
+ export default config;
package/setupTests.js ADDED
@@ -0,0 +1 @@
1
+ import "whatwg-fetch";
package/src/index.js CHANGED
@@ -1,5 +1,9 @@
1
- import MiradorTemplatePlugin from "./plugins/MiradorTemplatePlugin";
1
+ import miradorTemplatePlugin from './plugins/MiradorTemplatePlugin';
2
2
 
3
- export { MiradorTemplatePlugin };
3
+ export {
4
+ miradorTemplatePlugin,
5
+ };
4
6
 
5
- export default MiradorTemplatePlugin;
7
+ export default [
8
+ miradorTemplatePlugin,
9
+ ];
package/src/plugins/MiradorTemplatePlugin.js CHANGED
@@ -1,59 +1,27 @@
1
- import { takeEvery, select, put } from "redux-saga/effects";
2
- import {
3
- getCanvas,
4
- getCanvases,
5
- getWindowIds,
6
- } from "mirador/dist/es/src/state/selectors";
7
- import { setCanvas } from "mirador/dist/es/src/state/actions";
1
+ import React, { Component } from 'react';
2
+ import { getManifestoInstance } from 'mirador/dist/es/src/state/selectors/manifests';
8
3
 
9
- /**
10
- * Add a canvasId query parameter to the URL
11
- * @param {String} canvasId Canvas id from manifest
12
- */
13
- function insertCanvasIdIntoURL(canvasId) {
14
- const searchParams = new URLSearchParams(window.location.search);
15
- searchParams.set("canvasId", canvasId);
16
- window.history.replaceState(
17
- {},
18
- "",
19
- `${window.location.pathname}?${searchParams.toString()}`
20
- );
21
- }
22
-
23
- /**
24
- * Will be fired every time the SET_CANVAS action is dispatched
25
- * This will run on first load, and works in conjunction with a canvasId initialisation option
26
- * @param {Object} action Payload object
27
- */
28
- function* onCanvasChange(action) {
29
- const { canvasId, windowId } = action;
30
- const windowIds = yield select(getWindowIds);
31
-
32
- // Disregard events from other windows
33
- // (assumes we: start with/care about, one/the first window)
34
- // I.e. if user adds resource, SET_CANVAS will be dispatched from here
35
- // but we don't want to update the URL on those actions
36
- if (windowId !== windowIds[0]) return;
4
+ const mapStateToProps = (state, { windowId }) => ({
5
+ manifestId: (getManifestoInstance(state, { windowId }) || {}).id,
6
+ manifest: getManifestoInstance(state, { windowId }),
7
+ });
37
8
 
38
- // Resolve potentially broken canvasId to first canvas
39
- const targetCanvas = yield select(getCanvas, { canvasId, windowId });
9
+ class miradorTemplate extends Component {
10
+ render() {
40
11
 
41
- if (!targetCanvas) {
42
- const availableCanvases = yield select(getCanvases, { windowId });
43
- yield put(setCanvas(windowId, availableCanvases[0].id));
12
+ return (
13
+ <></>
14
+ );
44
15
  }
45
16
 
46
- // Update the URL
47
- insertCanvasIdIntoURL(action.canvasId);
17
+ componentDidMount() {
18
+ // Add custom stuff here
19
+ }
48
20
  }
49
21
 
50
- const rootSaga = function* () {
51
- yield takeEvery("mirador/SET_CANVAS", onCanvasChange);
52
- };
53
-
54
22
  export default {
55
- component: () => null, // No UI component
56
- mode: "add",
57
- saga: rootSaga,
58
- target: "Window",
59
- };
23
+ target: 'Window',
24
+ mode: 'add',
25
+ component: miradorTemplate,
26
+ mapStateToProps,
27
+ }
package/webpack.config.cjs ADDED
@@ -0,0 +1,52 @@
1
+ const path = require("path");
2
+ const webpack = require("webpack");
3
+
4
+ module.exports = (env, options) => {
5
+ return {
6
+ mode: options.mode,
7
+ entry: "./demo/demoEntry.js",
8
+ output: {
9
+ path: path.resolve(__dirname, "demo", "dist"),
10
+ filename: "demo.js",
11
+ publicPath: "/",
12
+ },
13
+ resolve: {
14
+ extensions: [".js", ".jsx"],
15
+ },
16
+ plugins: [
17
+ new webpack.IgnorePlugin({
18
+ resourceRegExp: /@blueprintjs\/(core|icons)/, // ignore optional UI framework dependencies
19
+ }),
20
+ ],
21
+ module: {
22
+ rules: [
23
+ {
24
+ test: /\.(js|jsx)$/,
25
+ exclude: /node_modules/,
26
+ use: {
27
+ loader: "babel-loader",
28
+ },
29
+ resolve: {
30
+ fullySpecified: false,
31
+ },
32
+ },
33
+ ],
34
+ },
35
+ devServer: {
36
+ static: [
37
+ {
38
+ directory: path.join(__dirname, "demo"),
39
+ },
40
+ {
41
+ directory: path.join(__dirname, "demo", "dist"),
42
+ },
43
+ ],
44
+ compress: true,
45
+ port: 9000,
46
+ historyApiFallback: true,
47
+ client: {
48
+ overlay: false,
49
+ },
50
+ },
51
+ };
52
+ };
package/dist/index.js DELETED
@@ -1,69 +0,0 @@
1
- var $gXNCa$reduxsagaeffects = require("redux-saga/effects");
2
- var $gXNCa$miradordistessrcstateselectors = require("mirador/dist/es/src/state/selectors");
3
- var $gXNCa$miradordistessrcstateactions = require("mirador/dist/es/src/state/actions");
4
-
5
-
6
- function $parcel$defineInteropFlag(a) {
7
- Object.defineProperty(a, '__esModule', {value: true, configurable: true});
8
- }
9
-
10
- function $parcel$export(e, n, v, s) {
11
- Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
12
- }
13
-
14
- $parcel$defineInteropFlag(module.exports);
15
-
16
- $parcel$export(module.exports, "default", () => $4fa36e821943b400$export$2e2bcd8739ae039);
17
- $parcel$export(module.exports, "MiradorTemplatePlugin", () => $a54d05f4736ae6e1$export$2e2bcd8739ae039);
18
-
19
-
20
-
21
- /**
22
- * Add a canvasId query parameter to the URL
23
- * @param {String} canvasId Canvas id from manifest
24
- */ function $a54d05f4736ae6e1$var$insertCanvasIdIntoURL(canvasId) {
25
- const searchParams = new URLSearchParams(window.location.search);
26
- searchParams.set("canvasId", canvasId);
27
- window.history.replaceState({}, "", `${window.location.pathname}?${searchParams.toString()}`);
28
- }
29
- /**
30
- * Will be fired every time the SET_CANVAS action is dispatched
31
- * This will run on first load, and works in conjunction with a canvasId initialisation option
32
- * @param {Object} action Payload object
33
- */ function* $a54d05f4736ae6e1$var$onCanvasChange(action) {
34
- const { canvasId: canvasId, windowId: windowId } = action;
35
- const windowIds = yield (0, $gXNCa$reduxsagaeffects.select)((0, $gXNCa$miradordistessrcstateselectors.getWindowIds));
36
- // Disregard events from other windows
37
- // (assumes we: start with/care about, one/the first window)
38
- // I.e. if user adds resource, SET_CANVAS will be dispatched from here
39
- // but we don't want to update the URL on those actions
40
- if (windowId !== windowIds[0]) return;
41
- // Resolve potentially broken canvasId to first canvas
42
- const targetCanvas = yield (0, $gXNCa$reduxsagaeffects.select)((0, $gXNCa$miradordistessrcstateselectors.getCanvas), {
43
- canvasId: canvasId,
44
- windowId: windowId
45
- });
46
- if (!targetCanvas) {
47
- const availableCanvases = yield (0, $gXNCa$reduxsagaeffects.select)((0, $gXNCa$miradordistessrcstateselectors.getCanvases), {
48
- windowId: windowId
49
- });
50
- yield (0, $gXNCa$reduxsagaeffects.put)((0, $gXNCa$miradordistessrcstateactions.setCanvas)(windowId, availableCanvases[0].id));
51
- }
52
- // Update the URL
53
- $a54d05f4736ae6e1$var$insertCanvasIdIntoURL(action.canvasId);
54
- }
55
- const $a54d05f4736ae6e1$var$rootSaga = function*() {
56
- yield (0, $gXNCa$reduxsagaeffects.takeEvery)("mirador/SET_CANVAS", $a54d05f4736ae6e1$var$onCanvasChange);
57
- };
58
- var $a54d05f4736ae6e1$export$2e2bcd8739ae039 = {
59
- component: ()=>null,
60
- mode: "add",
61
- saga: $a54d05f4736ae6e1$var$rootSaga,
62
- target: "Window"
63
- };
64
-
65
-
66
- var $4fa36e821943b400$export$2e2bcd8739ae039 = (0, $a54d05f4736ae6e1$export$2e2bcd8739ae039);
67
-
68
-
69
- //# sourceMappingURL=index.js.map
package/dist/index.js.map DELETED
@@ -1 +0,0 @@
1
- {"mappings":";;;;;;;;;;;;;;;;;;;;ACQA;;;CAGC,GACD,SAAS,4CAAsB,QAAQ;IACrC,MAAM,eAAe,IAAI,gBAAgB,OAAO,QAAQ,CAAC,MAAM;IAC/D,aAAa,GAAG,CAAC,YAAY;IAC7B,OAAO,OAAO,CAAC,YAAY,CACzB,CAAC,GACD,IACA,GAAG,OAAO,QAAQ,CAAC,QAAQ,CAAC,CAAC,EAAE,aAAa,QAAQ,IAAI;AAE5D;AAEA;;;;CAIC,GACD,UAAU,qCAAe,MAAM;IAC7B,MAAM,YAAE,QAAQ,YAAE,QAAQ,EAAE,GAAG;IAC/B,MAAM,YAAY,MAAM,CAAA,GAAA,8BAAK,EAAE,CAAA,GAAA,kDAAW;IAE1C,sCAAsC;IACtC,4DAA4D;IAC5D,sEAAsE;IACtE,uDAAuD;IACvD,IAAI,aAAa,SAAS,CAAC,EAAE,EAAE;IAE/B,sDAAsD;IACtD,MAAM,eAAe,MAAM,CAAA,GAAA,8BAAK,EAAE,CAAA,GAAA,+CAAQ,GAAG;kBAAE;kBAAU;IAAS;IAElE,IAAI,CAAC,cAAc;QACjB,MAAM,oBAAoB,MAAM,CAAA,GAAA,8BAAK,EAAE,CAAA,GAAA,iDAAU,GAAG;sBAAE;QAAS;QAC/D,MAAM,CAAA,GAAA,2BAAE,EAAE,CAAA,GAAA,6CAAQ,EAAE,UAAU,iBAAiB,CAAC,EAAE,CAAC,EAAE;IACvD;IAEA,iBAAiB;IACjB,4CAAsB,OAAO,QAAQ;AACvC;AAEA,MAAM,iCAAW;IACf,MAAM,CAAA,GAAA,iCAAQ,EAAE,sBAAsB;AACxC;IAEA,2CAAe;IACb,WAAW,IAAM;IACjB,MAAM;IACN,MAAM;IACN,QAAQ;AACV;;;IDtDA,2CAAe,CAAA,GAAA,wCAAoB","sources":["src/index.js","src/plugins/MiradorTemplatePlugin.js"],"sourcesContent":["import MiradorTemplatePlugin from \"./plugins/MiradorTemplatePlugin\";\n\nexport { MiradorTemplatePlugin };\n\nexport default MiradorTemplatePlugin;","import { takeEvery, select, put } from \"redux-saga/effects\";\nimport {\n getCanvas,\n getCanvases,\n getWindowIds,\n} from \"mirador/dist/es/src/state/selectors\";\nimport { setCanvas } from \"mirador/dist/es/src/state/actions\";\n\n/**\n * Add a canvasId query parameter to the URL\n * @param {String} canvasId Canvas id from manifest\n */\nfunction insertCanvasIdIntoURL(canvasId) {\n const searchParams = new URLSearchParams(window.location.search);\n searchParams.set(\"canvasId\", canvasId);\n window.history.replaceState(\n {},\n \"\",\n `${window.location.pathname}?${searchParams.toString()}`\n );\n}\n\n/**\n * Will be fired every time the SET_CANVAS action is dispatched\n * This will run on first load, and works in conjunction with a canvasId initialisation option\n * @param {Object} action Payload object\n */\nfunction* onCanvasChange(action) {\n const { canvasId, windowId } = action;\n const windowIds = yield select(getWindowIds);\n\n // Disregard events from other windows\n // (assumes we: start with/care about, one/the first window)\n // I.e. if user adds resource, SET_CANVAS will be dispatched from here\n // but we don't want to update the URL on those actions\n if (windowId !== windowIds[0]) return;\n\n // Resolve potentially broken canvasId to first canvas\n const targetCanvas = yield select(getCanvas, { canvasId, windowId });\n\n if (!targetCanvas) {\n const availableCanvases = yield select(getCanvases, { windowId });\n yield put(setCanvas(windowId, availableCanvases[0].id));\n }\n\n // Update the URL\n insertCanvasIdIntoURL(action.canvasId);\n}\n\nconst rootSaga = function* () {\n yield takeEvery(\"mirador/SET_CANVAS\", onCanvasChange);\n};\n\nexport default {\n component: () => null, // No UI component\n mode: \"add\",\n saga: rootSaga,\n target: \"Window\",\n};\n"],"names":[],"version":3,"file":"index.js.map"}