@selfcommunity/react-ui
Version:
React UI Components to integrate a Community created with SelfCommunity Platform.
34 lines (33 loc) • 3.25 kB
JavaScript
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const system_1 = require("@mui/system");
const classnames_1 = tslib_1.__importDefault(require("classnames"));
const material_1 = require("@mui/material");
const constants_1 = require("./constants");
const types_1 = require("../../types");
const react_intl_1 = require("react-intl");
const lab_1 = require("@mui/lab");
const classes = {
root: `${constants_1.PREFIX}-root`,
startItems: `${constants_1.PREFIX}-start-items`,
endItems: `${constants_1.PREFIX}-end-items`,
title: `${constants_1.PREFIX}-title`
};
const Root = (0, material_1.styled)(material_1.AppBar, {
name: constants_1.PREFIX,
slot: 'Root',
overridesResolver: (props, styles) => [styles.root],
shouldForwardProp: (prop) => prop !== 'open'
})(({ theme }) => ({}));
function LessonAppbar(inProps) {
// PROPS
const props = (0, system_1.useThemeProps)({
props: inProps,
name: constants_1.PREFIX
});
const { className = null, title = '', showComments, activePanel = null, handleOpen, onSave, editMode, onArrowBackClick, updating } = props, rest = tslib_1.__rest(props, ["className", "title", "showComments", "activePanel", "handleOpen", "onSave", "editMode", "onArrowBackClick", "updating"]);
return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ position: "fixed", open: Boolean(activePanel), className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsxs)(material_1.Toolbar, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.startItems }, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ edge: "start", onClick: onArrowBackClick }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "arrow_back" }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6", className: classes.title }, { children: title }))] })), editMode ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: () => handleOpen(types_1.SCLessonActionsType.SETTINGS), color: "primary" }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "settings" }) })), (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ variant: "contained", size: "small", onClick: onSave, loading: updating }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.lessonAppbar.button.save", defaultMessage: "ui.lessonAppbar.button.save" }) }))] })) : ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.endItems }, { children: [showComments && ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: () => handleOpen(types_1.SCLessonActionsType.COMMENTS) }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "chat_bubble_outline" }) }))), (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: () => handleOpen(types_1.SCLessonActionsType.LESSONS) }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "courses" }) }))] })))] }) })));
}
exports.default = LessonAppbar;
;