@selfcommunity/react-ui/lib/cjs/components/EditCourse/MenuRow.js

React UI Components to integrate a Community created with SelfCommunity Platform.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const material_1 = require("@mui/material");
const react_1 = require("react");
function MenuRow(props) {
    // PROPS
    const { icon = (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "more_vert" }), buttonClassName, disabled, children } = props;
    // STATES
    const [anchorEl, setAnchorEl] = (0, react_1.useState)(null);
    // HOOKS
    const theme = (0, material_1.useTheme)();
    const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
    // HANDLERS
    const handleClick = (0, react_1.useCallback)((e) => {
        setAnchorEl(e.currentTarget);
    }, [anchorEl]);
    const handleClose = (0, react_1.useCallback)(() => {
        setAnchorEl(null);
    }, [anchorEl]);
    return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: buttonClassName, onClick: handleClick, disabled: disabled }, { children: icon })), isMobile ? ((0, jsx_runtime_1.jsx)(material_1.SwipeableDrawer, Object.assign({ open: Boolean(anchorEl), onClick: handleClose, onClose: handleClose, onOpen: () => null, anchor: "bottom", disableSwipeToOpen: true }, { children: children }))) : ((0, jsx_runtime_1.jsx)(material_1.Menu, Object.assign({ anchorEl: anchorEl, open: Boolean(anchorEl), onClick: handleClose }, { children: children })))] }));
}
exports.default = (0, react_1.memo)(MenuRow);