import { Group, Box, Title, Text, ThemeIcon } from '@mantine/core';
import { jsxs, jsx } from 'react/jsx-runtime';

// src/components/display/CardHeader.tsx
function CardHeader({
  icon,
  title,
  subtitle,
  rightSection,
  titleOrder = 3,
  iconColor,
  mb = "md"
}) {
  const wrappedIcon = icon ? /* @__PURE__ */ jsx(ThemeIcon, { size: "md", variant: "light", color: iconColor, children: icon }) : null;
  return /* @__PURE__ */ jsxs(Group, { justify: "space-between", mb, gap: "md", align: "flex-start", wrap: "nowrap", children: [
    subtitle ? /* @__PURE__ */ jsxs(Box, { style: { minWidth: 0 }, children: [
      /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
        wrappedIcon,
        /* @__PURE__ */ jsx(Title, { order: titleOrder, style: { overflowWrap: "anywhere" }, children: title })
      ] }),
      /* @__PURE__ */ jsx(Text, { size: "sm", mt: 2, style: { color: "var(--color-text-dimmed)", overflowWrap: "anywhere" }, children: subtitle })
    ] }) : /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
      wrappedIcon,
      /* @__PURE__ */ jsx(Title, { order: titleOrder, style: { overflowWrap: "anywhere" }, children: title })
    ] }),
    rightSection
  ] });
}

export { CardHeader };
