"use client";
import { jsxs as r, jsx as m } from "react/jsx-runtime";
import { ChevronRight as c } from "lucide-react";
import * as p from "react";
import { Button as u } from "./button.js";
import { createPropsComparator as f } from "../utils/memo.js";
import { cn as d } from "../../../lib/utils.js";
function g(o, t = 0, e) {
  return e && t > 0 ? `${t}/${o}` : String(o);
}
function x({
  toolsCount: o,
  selectedCount: t = 0,
  indeterminate: e,
  onClick: n,
  className: i,
  name: a
}) {
  const s = g(o, t, e);
  return /* @__PURE__ */ r(
    u,
    {
      "aria-label": `View tools in ${a}`,
      className: d("gap-1", i),
      "data-slot": "view-tools-control",
      "data-testid": "view-tools",
      onClick: (l) => {
        l.stopPropagation(), n();
      },
      size: "sm",
      variant: "outline",
      children: [
        /* @__PURE__ */ r("span", { className: "text-xs leading-none", children: [
          s,
          " tools"
        ] }),
        /* @__PURE__ */ m(c, { className: "size-3.5 transition-transform group-hover:translate-x-0.5" })
      ]
    }
  );
}
const N = p.memo(
  x,
  f([
    "toolsCount",
    "selectedCount",
    "indeterminate",
    "className",
    "name",
    "onClick"
  ])
);
export {
  N as ViewToolsControl
};
