import { _ as __assign } from '../tslib.es6-faad35dc.js';
import { jsxs, jsx } from 'react/jsx-runtime';
import { styled } from '@mui/material/styles';
import MuiBox from '@mui/material/Box';
import Typography from './Typography.js';
import '@mui/material/Typography';
import '../theme/typography.js';

var IconBox = styled(MuiBox)(function () { return ({
    position: "relative",
    display: "flex",
    alignItems: "center"
}); });
var Point = styled("span")(function (_a) {
    var color = _a.color, theme = _a.theme;
    return ({
        display: "inline-block",
        width: theme.spacing(2),
        height: theme.spacing(2),
        marginRight: theme.spacing(1.5),
        left: 0,
        borderRadius: theme.borders.radius.rounded,
        backgroundColor: theme.palette.text[color !== null && color !== void 0 ? color : "primary"]
    });
});
var Status = function (_a) {
    var children = _a.children, _b = _a.color, color = _b === void 0 ? "primary" : _b, _c = _a.point, point = _c === void 0 ? true : _c;
    return (jsxs(IconBox, { children: [point && jsx(Point, { color: color }, void 0), jsx(Typography, __assign({ variant: "calloutBold", color: color, component: "span" }, { children: children }), void 0)] }, void 0));
};

export { Status as default };
