@etsoo/materialui/lib/mjs/BackButton.js

TypeScript Material-UI Implementation

import { jsx as _jsx } from "react/jsx-runtime";
import ArrowBackIcon from "@mui/icons-material/ArrowBack";
import IconButton from "@mui/material/IconButton";
import { useTheme } from "@mui/material/styles";
import { useNavigate } from "react-router";
/**
 * BackButton
 * @param props Props
 * @returns Component
 */
export function BackButton(props) {
    // Destruct
    const { color = "primary", size = "small", onClick, ...rest } = props;
    // Theme
    const theme = useTheme();
    // Navigate
    const navigate = useNavigate();
    // Color
    const pColor = color != "inherit" && color != "default" && color in theme.palette
        ? theme.palette[color]
        : theme.palette.primary;
    // Click handler
    const onClickLocal = async (event) => {
        if (onClick)
            onClick(event);
        // Navigate
        navigate(-1);
    };
    return (_jsx(IconButton, { "aria-label": "Back", color: color, size: size, onClick: onClickLocal, sx: {
            backgroundColor: pColor.contrastText,
            border: `1px solid ${pColor.light}`
        }, ...rest, children: _jsx(ArrowBackIcon, {}) }));
}