Select Git revision
-
David Beniamine authoredDavid Beniamine authored
WorkspaceArea.js 2.14 KiB
import { Component } from 'react';
import PropTypes from 'prop-types';
import { styled, lighten, darken } from '@mui/material/styles';
import ErrorDialog from '../containers/ErrorDialog';
import WorkspaceControlPanel from '../containers/WorkspaceControlPanel';
import Workspace from '../containers/Workspace';
import WorkspaceAdd from '../containers/WorkspaceAdd';
import BackgroundPluginArea from '../containers/BackgroundPluginArea';
import ns from '../config/css-ns';
const Root = styled('main', { name: 'WorkspaceArea', slot: 'root' })(({ theme }) => {
const getBackgroundColor = theme.palette.mode === 'light' ? darken : lighten;
return {
background: getBackgroundColor(theme.palette.grey.A200, 0.1),
bottom: 0,
left: 0,
overflow: 'hidden',
position: 'absolute',
right: 0,
top: 0,
};
});
/**
* This is the top level Mirador component.
* @prop {Object} manifests
*/
export class WorkspaceArea extends Component {
/**
* render
* @return {String} - HTML markup for the component
*/
render() {
const {
areaRef,
controlPanelVariant,
isWorkspaceAddVisible,
isWorkspaceControlPanelVisible,
lang,
t,
} = this.props;
return (
<>
{
isWorkspaceControlPanelVisible
&& <WorkspaceControlPanel variant={controlPanelVariant} />
}
<Root
className={ns('viewer')}
lang={lang}
aria-label={t('workspace')}
{...(areaRef ? { ref: areaRef } : {})}
>
{
isWorkspaceAddVisible
? <WorkspaceAdd />
: <Workspace />
}
<ErrorDialog />
<BackgroundPluginArea />
</Root>
</>
);
}
}
WorkspaceArea.propTypes = {
areaRef: PropTypes.shape({ current: PropTypes.instanceOf(Element) }),
controlPanelVariant: PropTypes.string,
isWorkspaceAddVisible: PropTypes.bool,
isWorkspaceControlPanelVisible: PropTypes.bool.isRequired,
lang: PropTypes.string,
t: PropTypes.func.isRequired,
};
WorkspaceArea.defaultProps = {
areaRef: null,
controlPanelVariant: undefined,
isWorkspaceAddVisible: false,
lang: undefined,
};