@craftercms/studio-ui
Version:
Services, components, models & utils to build CrafterCMS authoring extensions.
78 lines (76 loc) • 2.68 kB
JavaScript
/*
* Copyright (C) 2007-2022 Crafter Software Corporation. All Rights Reserved.
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Lesser General Public License version 3 as published by
* the Free Software Foundation.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Lesser General Public License for more details.
*
* You should have received a copy of the GNU Lesser General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
/*
* Copyright (C) 2007-2022 Crafter Software Corporation. All Rights Reserved.
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License version 3 as published by
* the Free Software Foundation.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
import { makeStyles } from 'tss-react/mui';
import AppBar from '@mui/material/AppBar';
import Toolbar from '@mui/material/Toolbar';
import React from 'react';
const useStyles = makeStyles()((theme, { appBar, toolbar } = {}) => ({
appBar: Object.assign(
{
borderBottom: `1px solid ${theme.palette.divider}`,
background: theme.palette.background.paper,
color: theme.palette.text.primary
},
appBar
),
toolbar: Object.assign(
{
paddingLeft: theme.spacing(1.5),
paddingRight: theme.spacing(1.5),
placeContent: 'center space-between',
'& > section': {
display: 'flex',
alignItems: 'center'
}
},
toolbar
)
}));
export const ViewToolbar = React.memo(function (props) {
var _a, _b;
const { classes, cx } = useStyles(props.styles);
const { children, elevation = 0 } = props;
return React.createElement(
AppBar,
{
color: 'inherit',
position: 'relative',
elevation: elevation,
className: cx(classes.appBar, (_a = props.classes) === null || _a === void 0 ? void 0 : _a.appBar)
},
React.createElement(
Toolbar,
{ className: cx(classes.toolbar, (_b = props.classes) === null || _b === void 0 ? void 0 : _b.toolbar) },
children
)
);
});
export default ViewToolbar;