import { _ as __assign } from '../tslib.es6-20a2a300.js';
import { jsxs, jsx } from 'react/jsx-runtime';
import Typography from './Typography.js';
import colors from '../theme/colors.js';
import { m as makeStyles } from '../makeStyles-c9a99c7a.js';
import { a as createStyles } from '../createStyles-16423e9e.js';
import { B as Box } from '../Box-581dc061.js';
import '../_commonjsHelpers-57e89916.js';
import '../theme/fontSize.js';
import '../theme/fontWeight.js';
import '../theme/fontFamily.js';
import '../theme/lineHeight.js';
import '../Typography-649a8eff.js';
import '../defaultTheme-49a26576.js';
import 'react';
import '../clsx.m-6243b874.js';
import '../withStyles-99aeb25b.js';
import '../hoist-non-react-statics.cjs-b718ab87.js';
import '../capitalize-5d3e9aac.js';
import '../styled-339d0187.js';

var useStyles = makeStyles(function (theme) {
    return createStyles({
        root: {
            position: "relative",
            display: "flex",
            alignItems: "center"
        },
        point: function (_a) {
            var color = _a.color;
            return {
                display: "inline-block",
                width: theme.spacing(2),
                height: theme.spacing(2),
                marginRight: theme.spacing(1.5),
                left: 0,
                borderRadius: "100%",
                backgroundColor: colors.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;
    var classes = useStyles({ color: color });
    return (jsxs(Box, __assign({ className: classes.root }, { children: [point && jsx("span", { className: classes.point }, void 0), jsx(Typography, __assign({ variant: "calloutBold", color: color, component: "span" }, { children: children }), void 0)] }), void 0));
};

export { Status as default };
