"use client";
import { jsx } from "../../packages/jsx/src/jsx-runtime.js";
import { Text } from "../Text/Text.js";
import { Flex } from "../Flex/Flex.js";
import { BorderRadius } from "../../tokens/BorderRadius.js";
import { Spacing } from "../../tokens/Spacing.js";
const Badge = ({ size = "20px", color = "Purple48", className, children, ...props }) => {
  return /* @__PURE__ */ jsx(Flex.Center, { as: "child", children: /* @__PURE__ */ jsx(
    "div",
    {
      className,
      sx: {
        width: "fit-content",
        minWidth: size,
        height: size,
        flexShrink: 0,
        px: Spacing["4px"],
        borderRadius: BorderRadius.FULL,
        bg: color
      },
      ...props,
      children: /* @__PURE__ */ jsx(Text.C10, { color: color === "White" ? "Midnight88" : "White88", children })
    }
  ) });
};
export {
  Badge
};
