"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import * as React from "react";
import { ChevronDown } from "lucide-react";
import { Badge } from "../primitives/badge.js";
import { cn } from "@open-mercato/shared/lib/utils";
function SectionHeader({
  title,
  count,
  action,
  className
}) {
  return /* @__PURE__ */ jsxs("div", { className: cn("flex items-center justify-between", className), children: [
    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
      /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold", children: title }),
      count != null && /* @__PURE__ */ jsx(Badge, { variant: "muted", className: "text-xs tabular-nums", children: count })
    ] }),
    action ? /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: action }) : null
  ] });
}
function CollapsibleSection({
  title,
  count,
  action,
  defaultCollapsed = false,
  collapsed: controlledCollapsed,
  onCollapsedChange,
  children,
  className,
  contentClassName
}) {
  const [internalCollapsed, setInternalCollapsed] = React.useState(defaultCollapsed);
  const isControlled = controlledCollapsed !== void 0;
  const isCollapsed = isControlled ? controlledCollapsed : internalCollapsed;
  const toggle = React.useCallback(() => {
    const next = !isCollapsed;
    if (!isControlled) setInternalCollapsed(next);
    onCollapsedChange?.(next);
  }, [isCollapsed, isControlled, onCollapsedChange]);
  return /* @__PURE__ */ jsxs("div", { className: cn("space-y-3", className), children: [
    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
      /* @__PURE__ */ jsxs(
        "button",
        {
          type: "button",
          onClick: toggle,
          className: "flex items-center gap-2 group",
          "aria-expanded": !isCollapsed,
          "aria-label": `${isCollapsed ? "Expand" : "Collapse"} ${title} section`,
          children: [
            /* @__PURE__ */ jsx(
              ChevronDown,
              {
                className: cn(
                  "h-4 w-4 text-muted-foreground transition-transform duration-200",
                  isCollapsed && "-rotate-90"
                )
              }
            ),
            /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold", children: title }),
            count != null && /* @__PURE__ */ jsx(Badge, { variant: "muted", className: "text-xs tabular-nums", children: count })
          ]
        }
      ),
      action ? /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: action }) : null
    ] }),
    !isCollapsed && /* @__PURE__ */ jsx("div", { className: contentClassName, children })
  ] });
}
export {
  CollapsibleSection,
  SectionHeader
};
//# sourceMappingURL=SectionHeader.js.map
