diff --git a/.eslintrc b/.eslintrc
index b7539c708583ffebd93c52bc000cfd5e16df3e52..9a432f4bd8f5276aba6a8734bb76e3c4d2421778 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -10,6 +10,10 @@
"parser": "@babel/eslint-parser",
"plugins": ["jest"],
"rules": {
+ "import/no-extraneous-dependencies": [
+ "error",
+{"devDependencies": true}
+],
"import/prefer-default-export": "off",
"no-console": "off",
"react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
diff --git a/.gitignore b/.gitignore
index 866ea4aeba00b07f7329a208070ef870d9bf2e7c..c3e6fb25981f0c63d9dc86e2de95e3e3a46090ef 100644
--- a/.gitignore
+++ b/.gitignore
@@ -6,4 +6,5 @@
/umd
npm-debug.log*
.idea
-
+.package-lock.json
+```
diff --git a/.gitmodules b/.gitmodules
new file mode 100644
index 0000000000000000000000000000000000000000..fa5d71cb5deb5c71fa8085c23b4ba5dd5730fece
--- /dev/null
+++ b/.gitmodules
@@ -0,0 +1,3 @@
+[submodule "mirador"]
+ path = mirador
+ url = https://github.com/ProjectMirador/mirador/tree/mui5.git
diff --git a/demo/src/index.js b/demo/src/index.js
index 9fa01c60a4c8676ae3f275e24b174a6bfa60b223..67e8534e3d70bffd0138d32c2176e2a5fc7d40cf 100644
--- a/demo/src/index.js
+++ b/demo/src/index.js
@@ -1,4 +1,4 @@
-import mirador from 'mirador/dist/es/src/index';
+import mirador from '../../mirador/dist/es/src/index';
import annotationPlugins from '../../src';
import LocalStorageAdapter from '../../src/LocalStorageAdapter';
import AnnototAdapter from '../../src/AnnototAdapter';
diff --git a/mirador b/mirador
new file mode 160000
index 0000000000000000000000000000000000000000..3def696e0a9014bbfb444a6770533771492c2d26
--- /dev/null
+++ b/mirador
@@ -0,0 +1 @@
+Subproject commit 3def696e0a9014bbfb444a6770533771492c2d26
diff --git a/package.json b/package.json
index e78925eda0d5ce6229c92ac0a5ff40a3f18a90d6..a6c75e342f5f7c9cd5705cd926b9dcd09c4c0158 100644
--- a/package.json
+++ b/package.json
@@ -23,39 +23,37 @@
"test:ci": "jest --ci --reporters=default --reporters=jest-junit --watchAll=false"
},
"dependencies": {
- "@psychobolt/react-paperjs": "< 1.0",
+ "@mui/system": "^5.15.1",
+ "@psychobolt/react-paperjs": "^1.0.3",
"@psychobolt/react-paperjs-editor": "0.0.11",
"draft-js": "^0.11.6",
"draft-js-export-html": "^1.4.1",
"draft-js-import-html": "^1.4.1",
- "material-ui-color-components": "^0.3.0",
"paper": "^0.12.11",
"react-color": "^2.18.1",
"react-resize-observer": "^1.1.1"
},
"peerDependencies": {
- "@material-ui/core": "^4.9.13",
- "@material-ui/icons": "^4.9.1",
- "@material-ui/lab": "^4.0.0-alpha.52",
"lodash": "^4.17.11",
- "mirador": "git+https://gitlab.tetras-libre.fr/iiif/mirador/mirador-video#annotation-on-video",
+ "mirador": "git+https://github.com/ProjectMirador/mirador/tree/mui5",
"prop-types": "^15.7.2",
- "react": "^16.8",
- "react-dom": "^16.8",
+ "react": "^17.0.0",
+ "react-dom": "^17.0.0",
"uuid": "^8.0.0"
},
"devDependencies": {
"@babel/core": "^7.10.4",
"@babel/eslint-parser": "^7.19.1",
+ "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
"@babel/preset-env": "^7.10.4",
"@babel/preset-react": "^7.10.4",
- "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
- "@material-ui/core": "^4.11.0",
- "@material-ui/icons": "^4.9.1",
- "@material-ui/lab": "^4.0.0-alpha.56",
+ "@mui/icons-material": "^5.11.16",
+ "@mui/lab": "^5.0.0-alpha.134",
+ "@mui/material": "^5.13.5",
+ "@mui/utils": "^5.13.1",
+ "@mui/x-tree-view": "^6.17.0",
"canvas": "^2.6.1",
"enzyme": "^3.11.0",
- "enzyme-adapter-react-16": "^1.15.2",
"eslint": "^8.11.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-config-react-app": "^7.0.0",
@@ -68,11 +66,11 @@
"jest-canvas-mock": "^2.2.0",
"jest-junit": "^15.0.0",
"jest-localstorage-mock": "^2.4.2",
- "mirador": "git+https://gitlab.tetras-libre.fr/iiif/mirador/mirador-video#annotation-on-video",
+ "mirador": "git+https://github.com/ProjectMirador/mirador/tree/mui5",
"nwb": "^0.24.7",
"prop-types": "^15.7.2",
- "react": "^16.8",
- "react-dom": "^16.8",
+ "react": "^17.0.0",
+ "react-dom": "^17.0",
"uuid": "^8.2.0"
},
"author": "",
diff --git a/src/AnnotationCreation.js b/src/AnnotationCreation.js
index 9c0c85f7bf3832a4f7b02e4d2d6652e59e7b014f..a76463e59fecd085848380a6573ffae33557e377 100644
--- a/src/AnnotationCreation.js
+++ b/src/AnnotationCreation.js
@@ -3,29 +3,29 @@ import PropTypes from 'prop-types';
import {
Button, Paper, Grid, Popover, Divider,
MenuList, MenuItem, ClickAwayListener,
-} from '@material-ui/core';
-import { Alarm, LastPage } from '@material-ui/icons';
-import Typography from '@material-ui/core/Typography';
-import ToggleButton from '@material-ui/lab/ToggleButton';
-import ToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup';
-import RectangleIcon from '@material-ui/icons/CheckBoxOutlineBlank';
-import CircleIcon from '@material-ui/icons/RadioButtonUnchecked';
-import PolygonIcon from '@material-ui/icons/Timeline';
-import GestureIcon from '@material-ui/icons/Gesture';
-import ClosedPolygonIcon from '@material-ui/icons/ChangeHistory';
-import OpenPolygonIcon from '@material-ui/icons/ShowChart';
-import FormatColorFillIcon from '@material-ui/icons/FormatColorFill';
-import StrokeColorIcon from '@material-ui/icons/BorderColor';
-import LineWeightIcon from '@material-ui/icons/LineWeight';
-import ArrowDropDownIcon from '@material-ui/icons/ArrowDropDown';
-import FormatShapesIcon from '@material-ui/icons/FormatShapes';
+} from '@mui/material';
+import { Alarm, LastPage } from '@mui/icons-material';
+import Typography from '@mui/material/Typography';
+import ToggleButton from '@mui/lab/ToggleButton';
+import ToggleButtonGroup from '@mui/lab/ToggleButtonGroup';
+import RectangleIcon from '@mui/icons-material/CheckBoxOutlineBlank';
+import CircleIcon from '@mui/icons-material/RadioButtonUnchecked';
+import PolygonIcon from '@mui/icons-material/Timeline';
+import GestureIcon from '@mui/icons-material/Gesture';
+import ClosedPolygonIcon from '@mui/icons-material/ChangeHistory';
+import OpenPolygonIcon from '@mui/icons-material/ShowChart';
+import FormatColorFillIcon from '@mui/icons-material/FormatColorFill';
+import StrokeColorIcon from '@mui/icons-material/BorderColor';
+import LineWeightIcon from '@mui/icons-material/LineWeight';
+import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown';
+import FormatShapesIcon from '@mui/icons-material/FormatShapes';
import { SketchPicker } from 'react-color';
import { v4 as uuid } from 'uuid';
-import { withStyles } from '@material-ui/core/styles';
-import CompanionWindow from 'mirador/dist/es/src/containers/CompanionWindow';
-import { VideosReferences } from 'mirador/dist/es/src/plugins/VideosReferences';
-import { OSDReferences } from 'mirador/dist/es/src/plugins/OSDReferences';
-import Slider from '@material-ui/core/Slider';
+import { styled } from '@mui/system';
+import CompanionWindow from '../mirador/dist/es/src/containers/CompanionWindow';
+import { VideosReferences } from '../mirador/dist/es/src/plugins/VideosReferences';
+import { OSDReferences } from '../mirador/dist/es/src/plugins/OSDReferences';
+import Slider from '@mui/material/Slider';
import AnnotationDrawing from './AnnotationDrawing';
import TextEditor from './TextEditor';
import WebAnnotation from './WebAnnotation';
@@ -33,6 +33,7 @@ import CursorIcon from './icons/Cursor';
import HMSInput from './HMSInput';
import ImageFormField from './ImageFormField';
import { secondsToHMS } from './utils';
+
/** Extract time information from annotation target */
function timeFromAnnoTarget(annotarget) {
console.info('TODO proper time extraction from: ', annotarget);
@@ -211,10 +212,14 @@ class AnnotationCreation extends Component {
};
/** update annotation start time */
- updateTstart(value) { this.setState({ tstart: value }); }
+ updateTstart(value) {
+ this.setState({ tstart: value });
+ }
/** update annotation end time */
- updateTend(value) { this.setState({ tend: value }); }
+ updateTend(value) {
+ this.setState({ tend: value });
+ }
/** seekTo/goto annotation start time */
@@ -410,7 +415,7 @@ class AnnotationCreation extends Component {
</div>
<div>
- { mediaIsVideo && (
+ {mediaIsVideo && (
<>
<Grid item xs={12} className={classes.paper}>
<Typography id="range-slider" variant="overline">
@@ -427,6 +432,7 @@ class AnnotationCreation extends Component {
getAriaValueText={secondsToHMS}
max={mediaVideo ? mediaVideo.video.duration : null}
color="secondary"
+ windowId={windowId}
classes={{
root: classes.MuiSliderColorSecondary,
}}
@@ -574,23 +580,23 @@ class AnnotationCreation extends Component {
<Divider flexItem orientation="vertical" className={classes.divider} />
{ /* close / open polygon mode only for freehand drawing mode. */
- activeTool === 'freehand'
- ? (
- <ToggleButtonGroup
- size="small"
- value={closedMode}
- onChange={this.changeClosedMode}
- >
- <ToggleButton value="closed">
- <ClosedPolygonIcon />
- </ToggleButton>
- <ToggleButton value="open">
- <OpenPolygonIcon />
- </ToggleButton>
- </ToggleButtonGroup>
- )
- : null
- }
+ activeTool === 'freehand'
+ ? (
+ <ToggleButtonGroup
+ size="small"
+ value={closedMode}
+ onChange={this.changeClosedMode}
+ >
+ <ToggleButton value="closed">
+ <ClosedPolygonIcon />
+ </ToggleButton>
+ <ToggleButton value="open">
+ <OpenPolygonIcon />
+ </ToggleButton>
+ </ToggleButtonGroup>
+ )
+ : null
+ }
</Grid>
</Grid>
</div>
@@ -632,7 +638,7 @@ class AnnotationCreation extends Component {
onClose={this.closeChooseColor}
>
<SketchPicker
- // eslint-disable-next-line react/destructuring-assignment
+ // eslint-disable-next-line react/destructuring-assignment
color={this.state[currentColorType] || {}}
onChangeComplete={this.updateStrokeColor}
/>
@@ -641,6 +647,7 @@ class AnnotationCreation extends Component {
);
}
}
+
/** */
const styles = (theme) => ({
buttonTimeContainer: {
@@ -735,11 +742,14 @@ AnnotationCreation.propTypes = {
AnnotationCreation.defaultProps = {
annotation: null,
canvases: [],
- closeCompanionWindow: () => {},
+ closeCompanionWindow: () => {
+ },
currentTime: null,
paused: true,
- setCurrentTime: () => {},
- setSeekTo: () => {},
+ setCurrentTime: () => {
+ },
+ setSeekTo: () => {
+ },
};
-export default withStyles(styles)(AnnotationCreation);
+export default styled(styles)(AnnotationCreation);
diff --git a/src/AnnotationDrawing.js b/src/AnnotationDrawing.js
index be5a656b28ec00112c8c9ec7488809f1f0d1a932..5512fb4493e8558e4750374a55fdd1955851de7a 100644
--- a/src/AnnotationDrawing.js
+++ b/src/AnnotationDrawing.js
@@ -2,8 +2,8 @@ import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import PropTypes from 'prop-types';
import ResizeObserver from 'react-resize-observer';
-import { OSDReferences } from 'mirador/dist/es/src/plugins/OSDReferences';
-import { VideosReferences } from 'mirador/dist/es/src/plugins/VideosReferences';
+import { OSDReferences } from '../mirador/dist/es/src/plugins/OSDReferences';
+import { VideosReferences } from '../mirador/dist/es/src/plugins/VideosReferences';
import { renderWithPaperScope, PaperContainer } from '@psychobolt/react-paperjs';
import
{
diff --git a/src/AnnotationExportDialog.js b/src/AnnotationExportDialog.js
index 9202209b55518038cf67acb5cd3b40c0b973ccaa..fed8a0041e115973548c2dbe3d3ad0fc5db30f74 100644
--- a/src/AnnotationExportDialog.js
+++ b/src/AnnotationExportDialog.js
@@ -1,15 +1,15 @@
import React, { Component } from 'react';
-import Dialog from '@material-ui/core/Dialog';
-import DialogContent from '@material-ui/core/DialogContent';
-import DialogTitle from '@material-ui/core/DialogTitle';
-import GetAppIcon from '@material-ui/icons/GetApp';
-import ListItemIcon from '@material-ui/core/ListItemIcon';
-import ListItemText from '@material-ui/core/ListItemText';
-import MenuList from '@material-ui/core/MenuList';
-import MenuItem from '@material-ui/core/MenuItem';
-import Typography from '@material-ui/core/Typography';
+import Dialog from '@mui/material/Dialog';
+import DialogContent from '@mui/material/DialogContent';
+import DialogTitle from '@mui/material/DialogTitle';
+import GetAppIcon from '@mui/icons-material/GetApp';
+import ListItemIcon from '@mui/material/ListItemIcon';
+import ListItemText from '@mui/material/ListItemText';
+import MenuList from '@mui/material/MenuList';
+import MenuItem from '@mui/material/MenuItem';
+import Typography from '@mui/material/Typography';
import PropTypes, { bool } from 'prop-types';
-import { withStyles } from '@material-ui/core';
+import { styled } from '@mui/system';
/** */
const styles = (theme) => ({
@@ -137,4 +137,4 @@ AnnotationExportDialog.defaultProps = {
classes: {},
};
-export default withStyles(styles)(AnnotationExportDialog);
+export default styled(styles)(AnnotationExportDialog);
diff --git a/src/CanvasListItem.js b/src/CanvasListItem.js
index f3a6526e50853a6efb6658c37f9a4716deca3232..07824c57b58955f8c16eb00bd1c1584cdcfd938a 100644
--- a/src/CanvasListItem.js
+++ b/src/CanvasListItem.js
@@ -1,9 +1,9 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
-import DeleteIcon from '@material-ui/icons/DeleteForever';
-import EditIcon from '@material-ui/icons/Edit';
-import ToggleButton from '@material-ui/lab/ToggleButton';
-import ToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup';
+import DeleteIcon from '@mui/icons-material/DeleteForever';
+import EditIcon from '@mui/icons-material/Edit';
+import ToggleButton from '@mui/lab/ToggleButton';
+import ToggleButtonGroup from '@mui/lab/ToggleButtonGroup';
import flatten from 'lodash/flatten';
import AnnotationActionsContext from './AnnotationActionsContext';
diff --git a/src/HMSInput.js b/src/HMSInput.js
index 70b487443721d5494082f0ebf15fadafd6b6f2fc..eb599d7394e73049718260a3072dbfffb0d81cf9 100644
--- a/src/HMSInput.js
+++ b/src/HMSInput.js
@@ -1,8 +1,7 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
-import { withStyles } from '@material-ui/core/styles';
-import { IconButton, Input, TextField } from '@material-ui/core';
-import { ArrowDownward, ArrowUpward } from '@material-ui/icons';
+import { withStyles } from '@mui/material/styles';
+import { Input } from '@mui/material';
import { secondsToHMSarray } from './utils';
/** hh:mm:ss input which behave like a single input for parent */
diff --git a/src/ImageFormField.js b/src/ImageFormField.js
index b7162a47c77ebcb9a7db666901bf7240626306d8..09aaa858c5622e80c6f55cd33f8227c53ad91765 100644
--- a/src/ImageFormField.js
+++ b/src/ImageFormField.js
@@ -1,7 +1,7 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
-import { withStyles } from '@material-ui/core/styles';
-import { TextField } from '@material-ui/core';
+import { withStyles } from '@mui/material/styles';
+import { TextField } from '@mui/material';
/** URL input with an <img> preview */
class ImageFormField extends Component {
diff --git a/src/SingleCanvasDialog.js b/src/SingleCanvasDialog.js
index 75fe3924270974329801868a34e8ecf6ddd9346c..9e3ad9f8f4a278382b3a4d234d199f5c60920e42 100644
--- a/src/SingleCanvasDialog.js
+++ b/src/SingleCanvasDialog.js
@@ -1,11 +1,11 @@
import React, { Component } from 'react';
-import Button from '@material-ui/core/Button';
-import Dialog from '@material-ui/core/Dialog';
-import DialogActions from '@material-ui/core/DialogActions';
-import DialogContent from '@material-ui/core/DialogContent';
-import DialogContentText from '@material-ui/core/DialogContentText';
-import DialogTitle from '@material-ui/core/DialogTitle';
-import Typography from '@material-ui/core/Typography';
+import Button from '@mui/material/Button';
+import Dialog from '@mui/material/Dialog';
+import DialogActions from '@mui/material/DialogActions';
+import DialogContent from '@mui/material/DialogContent';
+import DialogContentText from '@mui/material/DialogContentText';
+import DialogTitle from '@mui/material/DialogTitle';
+import Typography from '@mui/material/Typography';
import PropTypes from 'prop-types';
/**
diff --git a/src/TextEditor.js b/src/TextEditor.js
index 5f24d6dfa65f95c0285041742b8aba3fa7ed6010..925f6552683607651061f2a6d44888208f18c9b2 100644
--- a/src/TextEditor.js
+++ b/src/TextEditor.js
@@ -1,11 +1,11 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Editor, EditorState, RichUtils } from 'draft-js';
-import ToggleButton from '@material-ui/lab/ToggleButton';
-import ToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup';
-import BoldIcon from '@material-ui/icons/FormatBold';
-import ItalicIcon from '@material-ui/icons/FormatItalic';
-import { withStyles } from '@material-ui/core/styles';
+import ToggleButton from '@mui/lab/ToggleButton';
+import ToggleButtonGroup from '@mui/lab/ToggleButtonGroup';
+import BoldIcon from '@mui/icons-material/FormatBold';
+import ItalicIcon from '@mui/icons-material/FormatItalic';
+import { withStyles } from '@mui/material/styles';
import { stateToHTML } from 'draft-js-export-html';
import { stateFromHTML } from 'draft-js-import-html';
diff --git a/src/icons/Cursor.js b/src/icons/Cursor.js
index 5eee80db7b0480ceaa579a45dc94519f70ef856f..85b742071e419a180cd27f78d6cdabc0c520f907 100644
--- a/src/icons/Cursor.js
+++ b/src/icons/Cursor.js
@@ -1,5 +1,5 @@
import React from 'react';
-import SvgIcon from '@material-ui/core/SvgIcon';
+import SvgIcon from '@mui/material/SvgIcon';
/**
* CursorIcon ~
diff --git a/src/plugins/annotationCreationCompanionWindow.js b/src/plugins/annotationCreationCompanionWindow.js
index 4f8cf0303b228ccdef7e94467eb93e71e459c7a6..192765ee978cae832c783fc8ab1e3aa3893fcbba 100644
--- a/src/plugins/annotationCreationCompanionWindow.js
+++ b/src/plugins/annotationCreationCompanionWindow.js
@@ -1,8 +1,8 @@
-import * as actions from 'mirador/dist/es/src/state/actions';
-import { getCompanionWindow } from 'mirador/dist/es/src/state/selectors/companionWindows';
-import { getWindowCurrentTime, getWindowPausedStatus } from 'mirador/dist/es/src/state/selectors/window';
-import { getVisibleCanvases } from 'mirador/dist/es/src/state/selectors/canvases';
-import { getPresentAnnotationsOnSelectedCanvases } from 'mirador/dist/es/src/state/selectors/annotations';
+import * as actions from "../../mirador/src/state/actions";
+import { getCompanionWindow } from '../../mirador/src/state/selectors/companionWindows';
+import { getWindowCurrentTime, getWindowPausedStatus } from '../../mirador/src/state/selectors/window'
+import { getVisibleCanvases } from '../../mirador/src/state/selectors/canvases';
+import { getPresentAnnotationsOnSelectedCanvases } from '../../mirador/src/state/selectors/annotations'
import AnnotationCreation from '../AnnotationCreation';
/** */
diff --git a/src/plugins/canvasAnnotationsPlugin.js b/src/plugins/canvasAnnotationsPlugin.js
index 9102709e50af23b914af0843aa28b7a5bd71998e..96d8e2fc647ecb0396e5220641053ba414a4f77d 100644
--- a/src/plugins/canvasAnnotationsPlugin.js
+++ b/src/plugins/canvasAnnotationsPlugin.js
@@ -1,8 +1,8 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
-import { getVisibleCanvases } from 'mirador/dist/es/src/state/selectors/canvases';
-import * as actions from 'mirador/dist/es/src/state/actions';
-import { getWindowViewType } from 'mirador/dist/es/src/state/selectors';
+import { getVisibleCanvases } from '../../mirador/src/state/selectors/canvases';
+import * as actions from '../../mirador/src/state/actions';
+import { getWindowViewType } from '../../mirador/src/state/selectors';
import CanvasListItem from '../CanvasListItem';
import AnnotationActionsContext from '../AnnotationActionsContext';
import SingleCanvasDialog from '../SingleCanvasDialog';
diff --git a/src/plugins/externalStorageAnnotationPlugin.js b/src/plugins/externalStorageAnnotationPlugin.js
index f7e41305401d971be9b347d3460120118fc7111b..ec76a4eb199b0024fc5e13c2f1272c6c77a61ae9 100644
--- a/src/plugins/externalStorageAnnotationPlugin.js
+++ b/src/plugins/externalStorageAnnotationPlugin.js
@@ -1,8 +1,8 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
-import * as actions from 'mirador/dist/es/src/state/actions';
-import { getVisibleCanvases } from 'mirador/dist/es/src/state/selectors/canvases';
+import { getVisibleCanvases } from '../../mirador/src/state/selectors/canvases';
import isEqual from 'lodash/isEqual';
+import * as actions from '../../mirador/src/state/actions';
/** */
class ExternalStorageAnnotation extends Component {
diff --git a/src/plugins/miradorAnnotationPlugin.js b/src/plugins/miradorAnnotationPlugin.js
index e3a06fc3ddb7200ff602bc605ca96e28fa8c8f45..676c06d35de80a73b25bac45d471c7dbbf7766f8 100644
--- a/src/plugins/miradorAnnotationPlugin.js
+++ b/src/plugins/miradorAnnotationPlugin.js
@@ -1,11 +1,11 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
-import * as actions from 'mirador/dist/es/src/state/actions';
-import { getWindowViewType } from 'mirador/dist/es/src/state/selectors';
-import AddBoxIcon from '@material-ui/icons/AddBox';
-import GetAppIcon from '@material-ui/icons/GetApp';
-import { MiradorMenuButton } from 'mirador/dist/es/src/components/MiradorMenuButton';
-import { getVisibleCanvases } from 'mirador/dist/es/src/state/selectors/canvases';
+import AddBoxIcon from '@mui/icons-material/AddBox';
+import GetAppIcon from '@mui/icons-material/GetApp';
+import { getWindowViewType } from '../../mirador/src/state/selectors';
+import * as actions from '../../mirador/src/state/actions';
+import { MiradorMenuButton } from '../../mirador/src/components/MiradorMenuButton';
+import { getVisibleCanvases } from '../../mirador/dist/es/src/state/selectors/canvases';
import SingleCanvasDialog from '../SingleCanvasDialog';
import AnnotationExportDialog from '../AnnotationExportDialog';
import LocalStorageAdapter from '../LocalStorageAdapter';