@ucam/design-system
Version:
University of Cambridge Design System
51 lines (45 loc) • 7.51 kB
JavaScript
;
var tslib = require('tslib');
var React = require('react');
var core = require('@material-ui/core');
var PropTypes = require('prop-types');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
const DesktopDrawer = core.experimentalStyled(core.Drawer)(({ theme }) => ({
width: '240px',
'.MuiDrawer-paper': { width: '240px' },
[theme.breakpoints.down('sm')]: {
display: 'none'
}
}));
/* eslint-disable react/prop-types */
const SidebarBase = React__default['default'].forwardRef(function SidebarBase(_a, ref) {
var { children, drawerProps, sx } = _a, other = tslib.__rest(_a, ["children", "drawerProps", "sx"]);
const [mobileOpen, setMobileOpen] = React__default['default'].useState(false);
return (React__default['default'].createElement("nav", Object.assign({ ref: ref }, other),
React__default['default'].createElement(DesktopDrawer, Object.assign({ className: "UcamSidebar-desktop", sx: sx, variant: "permanent", open: true }, drawerProps), children),
React__default['default'].createElement(core.Drawer, Object.assign({ className: "UcamSidebar-mobile", sx: sx, variant: "temporary", open: mobileOpen, onClose: () => setMobileOpen(false), ModalProps: {
keepMounted: true // Better open performance on mobile.
} }, drawerProps), children)));
});
const Sidebar = React.forwardRef(function Sidebar(_a, ref) {
var { drawerProps = {} } = _a, rest = tslib.__rest(_a, ["drawerProps"]);
return React__default['default'].createElement(SidebarBase, Object.assign({ drawerProps: drawerProps }, rest, { ref: ref }));
});
Sidebar.propTypes = {
/**
* Additional className(s) to be applied to the root element
*/
className: PropTypes__default['default'].string,
/**
* Props applied to the Drawer element.
*/
drawerProps: PropTypes__default['default'].shape(core.Drawer.propTypes),
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: PropTypes__default['default'].object
};
module.exports = Sidebar;
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiU2lkZWJhci5qcyIsInNvdXJjZXMiOlsiL0B1Y2FtL2Rlc2lnbi1zeXN0ZW0vc3JjL1NpZGViYXIvU2lkZWJhci50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IEZDLCBmb3J3YXJkUmVmLCBXZWFrVmFsaWRhdGlvbk1hcCB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IERyYXdlciwgRHJhd2VyUHJvcHMgfSBmcm9tICdAbWF0ZXJpYWwtdWkvY29yZSc7XG5pbXBvcnQgeyBleHBlcmltZW50YWxTdHlsZWQgYXMgc3R5bGVkIH0gZnJvbSAnQG1hdGVyaWFsLXVpL2NvcmUnO1xuaW1wb3J0IFByb3BUeXBlcyBmcm9tICdwcm9wLXR5cGVzJztcbmltcG9ydCB7IFN4UHJvcHMgfSBmcm9tICdAbWF0ZXJpYWwtdWkvc3lzdGVtJztcbmltcG9ydCB7IFRoZW1lIH0gZnJvbSAnQG1hdGVyaWFsLXVpL2NvcmUvc3R5bGVzJztcblxudHlwZSBTaWRlYmFyQmFzZVByb3BzID0gSlNYLkludHJpbnNpY0VsZW1lbnRzWyduYXYnXSAmIFNpZGViYXJQcm9wcztcblxuY29uc3QgRGVza3RvcERyYXdlciA9IHN0eWxlZChEcmF3ZXIpKCh7IHRoZW1lIH0pID0+ICh7XG4gIHdpZHRoOiAnMjQwcHgnLFxuICAnLk11aURyYXdlci1wYXBlcic6IHsgd2lkdGg6ICcyNDBweCcgfSxcbiAgW3RoZW1lLmJyZWFrcG9pbnRzLmRvd24oJ3NtJyldOiB7XG4gICAgZGlzcGxheTogJ25vbmUnXG4gIH1cbn0pKTtcblxuLyogZXNsaW50LWRpc2FibGUgcmVhY3QvcHJvcC10eXBlcyAqL1xuY29uc3QgU2lkZWJhckJhc2UgPSBSZWFjdC5mb3J3YXJkUmVmPEhUTUxFbGVtZW50LCBTaWRlYmFyQmFzZVByb3BzPihmdW5jdGlvbiBTaWRlYmFyQmFzZShcbiAgeyBjaGlsZHJlbiwgZHJhd2VyUHJvcHMsIHN4LCAuLi5vdGhlciB9LFxuICByZWZcbikge1xuICBjb25zdCBbbW9iaWxlT3Blbiwgc2V0TW9iaWxlT3Blbl0gPSBSZWFjdC51c2VTdGF0ZShmYWxzZSk7XG5cbiAgcmV0dXJuIChcbiAgICA8bmF2IHJlZj17cmVmfSB7Li4ub3RoZXJ9PlxuICAgICAgPERlc2t0b3BEcmF3ZXIgY2xhc3NOYW1lPVwiVWNhbVNpZGViYXItZGVza3RvcFwiIHN4PXtzeH0gdmFyaWFudD1cInBlcm1hbmVudFwiIG9wZW4gey4uLmRyYXdlclByb3BzfT5cbiAgICAgICAge2NoaWxkcmVufVxuICAgICAgPC9EZXNrdG9wRHJhd2VyPlxuICAgICAgPERyYXdlclxuICAgICAgICBjbGFzc05hbWU9XCJVY2FtU2lkZWJhci1tb2JpbGVcIlxuICAgICAgICBzeD17c3h9XG4gICAgICAgIHZhcmlhbnQ9XCJ0ZW1wb3JhcnlcIlxuICAgICAgICBvcGVuPXttb2JpbGVPcGVufVxuICAgICAgICBvbkNsb3NlPXsoKSA9PiBzZXRNb2JpbGVPcGVuKGZhbHNlKX1cbiAgICAgICAgTW9kYWxQcm9wcz17e1xuICAgICAgICAgIGtlZXBNb3VudGVkOiB0cnVlIC8vIEJldHRlciBvcGVuIHBlcmZvcm1hbmNlIG9uIG1vYmlsZS5cbiAgICAgICAgfX1cbiAgICAgICAgey4uLmRyYXdlclByb3BzfVxuICAgICAgPlxuICAgICAgICB7Y2hpbGRyZW59XG4gICAgICA8L0RyYXdlcj5cbiAgICA8L25hdj5cbiAgKTtcbn0pO1xuLyogZXNsaW50LWVuYWJsZSByZWFjdC9wcm9wLXR5cGVzICovXG5cbnR5cGUgU2lkZWJhclByb3BzID0ge1xuICAvKipcbiAgICogUHJvcHMgYXBwbGllZCB0byB0aGUgRHJhd2VyIGVsZW1lbnQuXG4gICAqL1xuICBkcmF3ZXJQcm9wcz86IERyYXdlclByb3BzO1xuICAvKipcbiAgICogVGhlIHN5c3RlbSBwcm9wIHRoYXQgYWxsb3dzIGRlZmluaW5nIHN5c3RlbSBvdmVycmlkZXMgYXMgd2VsbCBhcyBhZGRpdGlvbmFsIENTUyBzdHlsZXMuXG4gICAqL1xuICBzeD86IFN4UHJvcHM8VGhlbWU+O1xufSAmIEpTWC5JbnRyaW5zaWNFbGVtZW50c1snbmF2J107XG5cbmNvbnN0IFNpZGViYXIgPSBmb3J3YXJkUmVmPEhUTUxFbGVtZW50LCBTaWRlYmFyUHJvcHM+KGZ1bmN0aW9uIFNpZGViYXIoeyBkcmF3ZXJQcm9wcyA9IHt9LCAuLi5yZXN0IH0sIHJlZikge1xuICByZXR1cm4gPFNpZGViYXJCYXNlIGRyYXdlclByb3BzPXtkcmF3ZXJQcm9wc30gey4uLnJlc3R9IHJlZj17cmVmfSAvPjtcbn0pO1xuXG5TaWRlYmFyLnByb3BUeXBlcyA9IHtcbiAgLyoqXG4gICAqIEFkZGl0aW9uYWwgY2xhc3NOYW1lKHMpIHRvIGJlIGFwcGxpZWQgdG8gdGhlIHJvb3QgZWxlbWVudFxuICAgKi9cbiAgY2xhc3NOYW1lOiBQcm9wVHlwZXMuc3RyaW5nLFxuICAvKipcbiAgICogUHJvcHMgYXBwbGllZCB0byB0aGUgRHJhd2VyIGVsZW1lbnQuXG4gICAqL1xuICBkcmF3ZXJQcm9wczogUHJvcFR5cGVzLnNoYXBlKChEcmF3ZXIgYXMgRkM8RHJhd2VyUHJvcHM+KS5wcm9wVHlwZXMgYXMgV2Vha1ZhbGlkYXRpb25NYXA8RHJhd2VyUHJvcHM+KSxcbiAgLyoqXG4gICAqIFRoZSBzeXN0ZW0gcHJvcCB0aGF0IGFsbG93cyBkZWZpbmluZyBzeXN0ZW0gb3ZlcnJpZGVzIGFzIHdlbGwgYXMgYWRkaXRpb25hbCBDU1Mgc3R5bGVzLlxuICAgKi9cbiAgc3g6IFByb3BUeXBlcy5vYmplY3Rcbn07XG5cbmV4cG9ydCBkZWZhdWx0IFNpZGViYXI7XG4iXSwibmFtZXMiOlsic3R5bGVkIiwiRHJhd2VyIiwiUmVhY3QiLCJmb3J3YXJkUmVmIiwiUHJvcFR5cGVzIl0sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7QUFTQSxNQUFNLGFBQWEsR0FBR0EsdUJBQU0sQ0FBQ0MsV0FBTSxDQUFDLENBQUMsQ0FBQyxFQUFFLEtBQUssRUFBRSxNQUFNO0lBQ25ELEtBQUssRUFBRSxPQUFPO0lBQ2Qsa0JBQWtCLEVBQUUsRUFBRSxLQUFLLEVBQUUsT0FBTyxFQUFFO0lBQ3RDLENBQUMsS0FBSyxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLEdBQUc7UUFDOUIsT0FBTyxFQUFFLE1BQU07S0FDaEI7Q0FDRixDQUFDLENBQUMsQ0FBQztBQUVKO0FBQ0EsTUFBTSxXQUFXLEdBQUdDLHlCQUFLLENBQUMsVUFBVSxDQUFnQyxTQUFTLFdBQVcsQ0FDdEYsRUFBdUMsRUFDdkMsR0FBRztRQURILEVBQUUsUUFBUSxFQUFFLFdBQVcsRUFBRSxFQUFFLE9BQVksRUFBUCxLQUFLLG9CQUFyQyxpQ0FBdUMsQ0FBRjtJQUdyQyxNQUFNLENBQUMsVUFBVSxFQUFFLGFBQWEsQ0FBQyxHQUFHQSx5QkFBSyxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUUxRCxRQUNFQSwrREFBSyxHQUFHLEVBQUUsR0FBRyxJQUFNLEtBQUs7UUFDdEJBLHdDQUFDLGFBQWEsa0JBQUMsU0FBUyxFQUFDLHFCQUFxQixFQUFDLEVBQUUsRUFBRSxFQUFFLEVBQUUsT0FBTyxFQUFDLFdBQVcsRUFBQyxJQUFJLFVBQUssV0FBVyxHQUM1RixRQUFRLENBQ0s7UUFDaEJBLHdDQUFDRCxXQUFNLGtCQUNMLFNBQVMsRUFBQyxvQkFBb0IsRUFDOUIsRUFBRSxFQUFFLEVBQUUsRUFDTixPQUFPLEVBQUMsV0FBVyxFQUNuQixJQUFJLEVBQUUsVUFBVSxFQUNoQixPQUFPLEVBQUUsTUFBTSxhQUFhLENBQUMsS0FBSyxDQUFDLEVBQ25DLFVBQVUsRUFBRTtnQkFDVixXQUFXLEVBQUUsSUFBSTthQUNsQixJQUNHLFdBQVcsR0FFZCxRQUFRLENBQ0YsQ0FDTCxFQUNOO0FBQ0osQ0FBQyxDQUFDLENBQUM7TUFjRyxPQUFPLEdBQUdFLGdCQUFVLENBQTRCLFNBQVMsT0FBTyxDQUFDLEVBQTZCLEVBQUUsR0FBRztRQUFsQyxFQUFFLFdBQVcsR0FBRyxFQUFFLE9BQVcsRUFBTixJQUFJLG9CQUEzQixlQUE2QixDQUFGO0lBQ2hHLE9BQU9ELHdDQUFDLFdBQVcsa0JBQUMsV0FBVyxFQUFFLFdBQVcsSUFBTSxJQUFJLElBQUUsR0FBRyxFQUFFLEdBQUcsSUFBSSxDQUFDO0FBQ3ZFLENBQUMsRUFBRTtBQUVILE9BQU8sQ0FBQyxTQUFTLEdBQUc7Ozs7SUFJbEIsU0FBUyxFQUFFRSw2QkFBUyxDQUFDLE1BQU07Ozs7SUFJM0IsV0FBVyxFQUFFQSw2QkFBUyxDQUFDLEtBQUssQ0FBRUgsV0FBMEIsQ0FBQyxTQUEyQyxDQUFDOzs7O0lBSXJHLEVBQUUsRUFBRUcsNkJBQVMsQ0FBQyxNQUFNO0NBQ3JCOzs7OyJ9