"use client";
import { jsxs as i, jsx as e } from "react/jsx-runtime";
import { c as k } from "./index-UgeK3A8s.js";
import { Key as R, Fingerprint as j, Wrench as O, Package as $ } from "lucide-react";
import * as f from "react";
import { Card as D, CardContent as K } from "./components/ui/atoms/card.js";
import { Checkbox as z } from "./components/ui/atoms/checkbox.js";
import { ViewToolsControl as P } from "./components/ui/atoms/view-tools-control.js";
import { cn as m } from "./lib/utils.js";
import { Badge as N } from "./components/ui/atoms/badge.js";
import { ByocBadge as U } from "./components/ui/atoms/byoc-badge.js";
import "./components/ui/atoms/chart.js";
import "./components/ui/atoms/json-highlight.js";
import "./markdown-Cv6uZPhi.js";
import "./components/ui/atoms/mobile-tooltip.js";
import { ProBadge as _ } from "./components/ui/atoms/pro-badge.js";
import "./react-resizable-panels-BqIpIFl2.js";
import { Tooltip as v, TooltipTrigger as y, TooltipContent as w } from "./components/ui/atoms/tooltip.js";
import "./components/ui/atoms/sidebar.js";
import "./components/ui/molecules/date-time-picker.js";
import "./components/ui/molecules/prompt-input.js";
import "./components/ui/molecules/tool-call-accordion.js";
import "./components/ui/molecules/tool-card.js";
import { areStringArraysEqual as h, createPropsComparator as B } from "./components/ui/utils/memo.js";
import "./metadata/oauth-providers.js";
import "./metadata/toolkits.js";
const F = ({
  secrets: r,
  className: a
}) => {
  const s = (r.pending?.length ?? 0) > 0, n = /* @__PURE__ */ i("div", { className: "space-y-3", children: [
    /* @__PURE__ */ e("div", { className: "font-medium text-gray-900 dark:text-gray-100", children: "API Keys & Secrets" }),
    (r.configured?.length ?? 0) > 0 && /* @__PURE__ */ i("div", { children: [
      /* @__PURE__ */ e("div", { className: "mb-1.5 font-medium text-emerald-700 text-xs dark:text-emerald-300", children: "Configured" }),
      /* @__PURE__ */ e("ul", { className: "list-disc space-y-1 pl-4 text-gray-700 text-xs dark:text-gray-300", children: r.configured?.map((t) => /* @__PURE__ */ e("li", { children: t }, `cfg-${t}`)) })
    ] }),
    (r.pending?.length ?? 0) > 0 && /* @__PURE__ */ i("div", { children: [
      /* @__PURE__ */ e("div", { className: "mb-1.5 font-medium text-red-700 text-xs dark:text-red-300", children: "Pending" }),
      /* @__PURE__ */ e("ul", { className: "list-disc space-y-1 pl-4 text-gray-700 text-xs dark:text-gray-300", children: r.pending?.map((t) => /* @__PURE__ */ e("li", { children: t }, `pen-${t}`)) })
    ] })
  ] });
  return /* @__PURE__ */ i(v, { children: [
    /* @__PURE__ */ i(
      y,
      {
        render: /* @__PURE__ */ e(
          N,
          {
            className: m(
              "gap-1.5 bg-amber-100 text-amber-800 dark:bg-amber-900/30 dark:text-amber-200",
              s && "border-l-2 border-l-yellow-600",
              a
            ),
            variant: "secondary"
          }
        ),
        children: [
          /* @__PURE__ */ e(R, { className: "h-3.5 w-3.5" }),
          "Secrets"
        ]
      }
    ),
    /* @__PURE__ */ e(w, { className: "max-w-xs p-4 text-sm", sideOffset: 12, children: n })
  ] });
}, S = ({
  oauth: r,
  className: a
}) => {
  const s = r.providers.filter((o) => o.status === "active").length, t = r.providers.length - s > 0, l = /* @__PURE__ */ i("div", { className: "space-y-3", children: [
    /* @__PURE__ */ e("div", { className: "font-medium text-gray-900 dark:text-gray-100", children: "OAuth Authorization" }),
    r.providers.map((o) => /* @__PURE__ */ i("div", { className: "text-gray-700 text-xs dark:text-gray-300", children: [
      /* @__PURE__ */ e("span", { className: "font-medium", children: o.id }),
      " ",
      o.status === "active" ? /* @__PURE__ */ e("span", { className: "text-emerald-700 dark:text-emerald-300", children: "(active)" }) : /* @__PURE__ */ e("span", { className: "text-red-700 dark:text-red-300", children: "(inactive)" }),
      o.scopes.length > 0 && /* @__PURE__ */ e("div", { className: "mt-1 pl-3 text-gray-600 dark:text-gray-400", children: o.scopes.join(", ") })
    ] }, o.id))
  ] });
  return /* @__PURE__ */ i(v, { children: [
    /* @__PURE__ */ i(
      y,
      {
        render: /* @__PURE__ */ e(
          N,
          {
            className: m(
              "gap-1.5 bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-200",
              t && "border-l-2 border-l-yellow-600",
              a
            ),
            variant: "secondary"
          }
        ),
        children: [
          /* @__PURE__ */ e(j, { className: "h-3.5 w-3.5" }),
          "OAuth"
        ]
      }
    ),
    /* @__PURE__ */ e(w, { className: "max-w-xs p-4 text-sm", sideOffset: 12, children: l })
  ] });
};
function W({
  requirementsSummary: r,
  isByoc: a = !1,
  isPro: s = !1,
  badgeClassName: n
}) {
  if (!(r?.secrets || r?.oauth || a || s))
    return null;
  const { secrets: t, oauth: l } = r;
  return /* @__PURE__ */ i("div", { className: "flex w-full flex-wrap items-center gap-1.5", children: [
    t && /* @__PURE__ */ e(G, { className: n, secrets: t }),
    l && /* @__PURE__ */ e(H, { className: n, oauth: l }),
    a && /* @__PURE__ */ e(U, { className: m("gap-1.5 rounded-md", n) }),
    s && /* @__PURE__ */ e(_, { className: m("gap-1.5 rounded-md", n) })
  ] });
}
const G = f.memo(F, (r, a) => r.className !== a.className ? !1 : r.secrets === a.secrets ? !0 : !(!(r.secrets && a.secrets) || !h(
  r.secrets.configured,
  a.secrets.configured
) || !h(
  r.secrets.pending,
  a.secrets.pending
))), H = f.memo(S, (r, a) => {
  if (r.className !== a.className)
    return !1;
  if (r.oauth === a.oauth)
    return !0;
  if (!(r.oauth && a.oauth))
    return !1;
  const s = r.oauth.providers, n = a.oauth.providers;
  if (s === n)
    return !0;
  if (s.length !== n.length)
    return !1;
  for (let t = 0; t < s.length; t++) {
    const l = s[t], o = n[t];
    if (!(l.id === o.id && l.status === o.status) || !h(l.scopes, o.scopes))
      return !1;
  }
  return !0;
}), J = f.memo(
  W,
  B(["requirementsSummary", "isByoc", "isPro", "badgeClassName"])
), L = k("", {
  variants: {
    selected: {
      true: "border-2 border-emerald-600 dark:border-emerald-400",
      false: ""
    },
    partial: {
      true: "border-2 border-emerald-600 border-dashed dark:border-emerald-400",
      false: ""
    }
  },
  compoundVariants: [
    {
      selected: !1,
      partial: !1,
      class: "border-neutral-200 hover:border-neutral-300 dark:border-neutral-800 dark:hover:border-neutral-700"
    }
  ]
}), M = (r, a, s, n) => r && !a && s > 0 ? `${s}/${n} tools` : `${n} tool${n === 1 ? "" : "s"}`, Q = k(
  "inline-flex items-center gap-1 rounded-full px-2 py-1 font-medium text-xs",
  {
    variants: {
      indeterminate: {
        true: "bg-emerald-100 text-emerald-700 dark:bg-emerald-900/30 dark:text-emerald-200",
        false: "bg-neutral-100 text-neutral-700 dark:bg-neutral-800 dark:text-neutral-200"
      }
    }
  }
);
function X({
  name: r,
  version: a,
  toolsCount: s,
  Icon: n = (p) => /* @__PURE__ */ e($, { ...p }),
  isSelected: t = !1,
  isPartiallySelected: l = !1,
  selectedToolsCount: o = 0,
  requirementsSummary: x,
  onSelect: g,
  onView: c,
  hideCheckbox: u = !1,
  isByoc: C,
  isPro: A,
  ...I
}) {
  const p = f.useCallback(() => {
    if (u && c) {
      c();
      return;
    }
    g?.(!(t || l));
  }, [u, t, l, g, c]), T = (d) => {
    const q = d.key === "Enter" || d.code === "Enter", E = d.key === " " || d.key === "Spacebar" || d.code === "Space";
    (q || E) && (d.preventDefault(), p()), (d.key === "ArrowRight" || d.code === "ArrowRight") && c && (d.preventDefault(), c());
  }, b = l && !t;
  return /* @__PURE__ */ e(
    D,
    {
      ...I,
      "aria-description": "Click card to select this toolkit. Use the View tools control to see its tools.",
      "aria-label": `Select toolkit ${r}`,
      className: m(
        "group",
        "relative",
        "h-full",
        "cursor-pointer",
        "overflow-hidden",
        "rounded-lg",
        "border",
        "py-3.5",
        "transition-all",
        "duration-200",
        "bg-white/50",
        "hover:bg-white/70",
        "dark:bg-neutral-900/50",
        "dark:hover:bg-neutral-900/70",
        "hover:shadow-lg",
        L({
          selected: t,
          partial: l
        })
      ),
      onClick: (d) => {
        d.target.closest('[data-slot="checkbox-wrapper"]') || p();
      },
      onKeyDown: T,
      tabIndex: 0,
      children: /* @__PURE__ */ e(K, { className: "px-3", children: /* @__PURE__ */ i("div", { className: "space-y-3", children: [
        /* @__PURE__ */ i(
          "div",
          {
            className: m(
              "grid items-center gap-2",
              "grid-cols-[20px_1fr_auto]",
              u && "grid-cols-[1fr_auto]"
            ),
            children: [
              !u && /* @__PURE__ */ e(
                "div",
                {
                  className: "flex items-center justify-center",
                  "data-slot": "checkbox-wrapper",
                  children: /* @__PURE__ */ e(
                    z,
                    {
                      checked: t,
                      indeterminate: l && !t,
                      onCheckedChange: (d) => {
                        g?.(d === !0);
                      },
                      tabIndex: -1
                    }
                  )
                }
              ),
              /* @__PURE__ */ e("div", { className: "mr-1.5 min-w-0", children: /* @__PURE__ */ i("div", { className: "flex min-w-0 items-center gap-3", children: [
                /* @__PURE__ */ e("div", { className: "flex size-9 items-center justify-center rounded bg-gradient-to-b from-neutral-200 to-neutral-100 ring-1 ring-black/5 dark:from-neutral-800 dark:to-neutral-900 dark:ring-white/5", children: /* @__PURE__ */ e(n, { className: "size-6 text-neutral-700 dark:text-neutral-200" }) }),
                /* @__PURE__ */ i("div", { className: "flex h-9 min-w-0 flex-col justify-center space-y-0.5", children: [
                  /* @__PURE__ */ e("h3", { className: "truncate font-semibold text-base text-neutral-900 leading-tight dark:text-neutral-100", children: r }),
                  a && /* @__PURE__ */ i("span", { className: "font-medium text-neutral-500 text-xs leading-tight dark:text-neutral-400", children: [
                    "v",
                    a
                  ] })
                ] })
              ] }) }),
              /* @__PURE__ */ e("div", { className: "mt-0.5 self-center justify-self-end", children: c ? /* @__PURE__ */ e(
                P,
                {
                  indeterminate: b,
                  name: r,
                  onClick: () => c(),
                  selectedCount: o,
                  toolsCount: s
                }
              ) : /* @__PURE__ */ i(
                "div",
                {
                  className: Q({
                    indeterminate: b
                  }),
                  children: [
                    /* @__PURE__ */ e(O, { className: "h-3 w-3" }),
                    /* @__PURE__ */ e("span", { children: M(
                      l,
                      t,
                      o,
                      s
                    ) })
                  ]
                }
              ) })
            ]
          }
        ),
        /* @__PURE__ */ e("div", { className: m(u ? "ml-0" : "ml-8"), children: /* @__PURE__ */ e(
          J,
          {
            isByoc: C,
            isPro: A,
            requirementsSummary: x
          }
        ) })
      ] }) })
    }
  );
}
const Y = B([
  "name",
  "version",
  "description",
  "toolsCount",
  "isSelected",
  "isPartiallySelected",
  "selectedToolsCount",
  "Icon",
  "requirementsSummary",
  "isByoc",
  "isPro",
  "hideCheckbox"
]), ye = f.memo(
  X,
  Y
);
export {
  H as O,
  J as R,
  G as S,
  ye as T
};
