import { jsx } from "react/jsx-runtime";
/* empty css                                                                                                                                                                                       */
/* empty css                                                                                                                                                                                        */
/* empty css                                                                                                                                                                                                */
/* empty css                                                                                                                                                                                           */
/* empty css                                                                                                                                                                                           */
import { Typography } from "../../primitive/Typography/index.mjs";
import { Dot } from "../Dot/index.mjs";
import { Badge } from "../../node_modules/.pnpm/@mantine_core@7.15.2_patch_hash_jclkxeaefn6uz54h34k3r3yjsq_@mantine_hooks@7.15.2_react@18.3.1_szqfuioo5damkjdixckhzmwycq/node_modules/@mantine/core/esm/components/Badge/Badge.mjs";
const DotBadge = ({ color = "green", children, ...rest }) => {
  return /* @__PURE__ */ jsx(
    Badge,
    {
      variant: "light",
      styles: (theme) => ({
        root: {
          backgroundColor: theme.colors[color][1],
          borderRadius: theme.defaultRadius,
          textTransform: "none",
          height: 28
        }
      }),
      leftSection: /* @__PURE__ */ jsx(Dot, { color, size: 8 }),
      ...rest,
      children: /* @__PURE__ */ jsx(Typography, { fz: 14, fw: 500, c: `${color}.8`, children })
    }
  );
};
export {
  DotBadge
};
