\n
\n 0 && classes[position], this.areaLayoutClass()].join(' ')} style={{ display: companionAreaOpen ? 'flex' : 'none' }}>\n {\n companionWindowIds.map(id => (\n \n ))\n }\n
\n \n {\n setCompanionAreaOpen && position === 'left' && sideBarOpen && companionWindowIds.length > 0\n && (\n
\n { setCompanionAreaOpen(windowId, !companionAreaOpen); }}\n TooltipProps={{ placement: 'right' }}\n >\n {this.collapseIcon()}\n \n
\n )\n }\n
\n );\n }\n}\n\nCompanionArea.propTypes = {\n classes: PropTypes.objectOf(PropTypes.string),\n companionAreaOpen: PropTypes.bool.isRequired,\n companionWindowIds: PropTypes.arrayOf(PropTypes.string).isRequired,\n direction: PropTypes.string.isRequired,\n position: PropTypes.string.isRequired,\n setCompanionAreaOpen: PropTypes.func,\n sideBarOpen: PropTypes.bool,\n t: PropTypes.func.isRequired,\n windowId: PropTypes.string.isRequired,\n};\n\nCompanionArea.defaultProps = {\n classes: {},\n setCompanionAreaOpen: () => {},\n sideBarOpen: false,\n};\n","import { compose } from 'redux';\nimport { connect } from 'react-redux';\nimport { withStyles } from '@material-ui/core';\nimport { withTranslation } from 'react-i18next';\nimport { withPlugins } from '../extend/withPlugins';\nimport {\n getCompanionWindowIdsForPosition, getCompanionAreaVisibility, getThemeDirection, getWindow,\n} from '../state/selectors';\nimport * as actions from '../state/actions';\nimport { CompanionArea } from '../components/CompanionArea';\n\n/** */\nconst mapStateToProps = (state, { windowId, position }) => ({\n companionAreaOpen: getCompanionAreaVisibility(state, { position, windowId }),\n companionWindowIds: getCompanionWindowIdsForPosition(state, { position, windowId }),\n direction: getThemeDirection(state),\n sideBarOpen: (getWindow(state, { windowId }) || {}).sideBarOpen,\n});\n\nconst mapDispatchToProps = ({\n setCompanionAreaOpen: actions.setCompanionAreaOpen,\n});\n\n/** */\nconst styles = theme => ({\n horizontal: {\n flexDirection: 'column',\n width: '100%',\n },\n left: {\n minWidth: 235,\n },\n root: {\n display: 'flex',\n minHeight: 0,\n position: 'relative',\n zIndex: theme.zIndex.appBar - 2,\n },\n toggle: {\n backgroundColor: theme.palette.background.paper,\n border: `1px solid ${theme.palette.shades.dark}`,\n borderRadius: 0,\n height: '48px',\n left: '100%',\n marginTop: '1rem',\n padding: 2,\n position: 'absolute',\n width: '23px',\n zIndex: theme.zIndex.drawer,\n },\n toggleButton: {\n marginBottom: 12,\n marginTop: 12,\n padding: 0,\n },\n});\n\nconst enhance = compose(\n withTranslation(),\n withStyles(styles),\n connect(mapStateToProps, mapDispatchToProps),\n withPlugins('CompanionArea'),\n);\n\nexport default enhance(CompanionArea);\n","import React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport {\n Button,\n Chip,\n Dialog,\n DialogActions,\n DialogTitle,\n Link,\n MenuList,\n MenuItem,\n Typography,\n} from '@material-ui/core';\nimport ArrowBackIcon from '@material-ui/icons/ArrowBackSharp';\nimport Skeleton from '@material-ui/lab/Skeleton';\nimport asArray from '../lib/asArray';\nimport { LabelValueMetadata } from './LabelValueMetadata';\nimport CollapsibleSection from '../containers/CollapsibleSection';\nimport ScrollIndicatedDialogContent from '../containers/ScrollIndicatedDialogContent';\nimport ManifestInfo from '../containers/ManifestInfo';\n\n/**\n * a dialog providing the possibility to select the collection\n */\nexport class CollectionDialog extends Component {\n /** */\n static getUseableLabel(resource, index) {\n return (resource\n && resource.getLabel\n && resource.getLabel().length > 0)\n ? resource.getLabel().getValue()\n : String(index + 1);\n }\n\n /** */\n constructor(props) {\n super(props);\n\n this.state = { filter: null };\n this.hideDialog = this.hideDialog.bind(this);\n }\n\n /** */\n setFilter(filter) {\n this.setState({ filter });\n }\n\n /** */\n hideDialog() {\n const {\n hideCollectionDialog, windowId,\n } = this.props;\n\n hideCollectionDialog(windowId);\n }\n\n /** */\n selectCollection(c) {\n const {\n collectionPath,\n manifestId,\n showCollectionDialog,\n windowId,\n } = this.props;\n\n showCollectionDialog(c.id, [...collectionPath, manifestId], windowId);\n }\n\n /** */\n goToPreviousCollection() {\n const { collectionPath, showCollectionDialog, windowId } = this.props;\n\n showCollectionDialog(\n collectionPath[collectionPath.length - 1],\n collectionPath.slice(0, -1),\n windowId,\n );\n }\n\n /** */\n selectManifest(m) {\n const {\n addWindow,\n collectionPath,\n manifestId,\n setWorkspaceAddVisibility,\n updateWindow,\n windowId,\n } = this.props;\n\n if (windowId) {\n updateWindow(windowId, {\n canvasId: null, collectionPath: [...collectionPath, manifestId], manifestId: m.id,\n });\n } else {\n addWindow({ collectionPath: [...collectionPath, manifestId], manifestId: m.id });\n }\n\n this.hideDialog();\n setWorkspaceAddVisibility(false);\n }\n\n /** */\n dialogContainer() {\n const { containerId, windowId } = this.props;\n return document.querySelector(`#${containerId} #${windowId}`);\n }\n\n /** */\n placeholder() {\n const { classes } = this.props;\n\n return (\n