"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import { useState, useCallback } from "react";
import { JsonView, allExpanded, collapseAllNested, defaultStyles, darkStyles } from "react-json-view-lite";
import "react-json-view-lite/dist/index.css";
import { useTheme } from "next-themes";
import { ChevronsDownUp, ChevronsUpDown, Copy } from "lucide-react";
import { cn } from "../../../lib/utils/index.js";
import { Button } from "../../ui/button.js";
function JsonViewer({ data, className, initialExpanded = 2 }) {
  const { resolvedTheme } = useTheme();
  const isDark = resolvedTheme === "dark";
  const shouldExpandNode = initialExpanded === "all" ? allExpanded : initialExpanded === "none" ? collapseAllNested : (level) => level < initialExpanded;
  return /* @__PURE__ */ jsx("div", { className: cn("font-mono text-sm", className), children: /* @__PURE__ */ jsx(
    JsonView,
    {
      data,
      shouldExpandNode,
      style: isDark ? darkStyles : defaultStyles
    }
  ) });
}
function JsonViewerWithControls({
  data,
  className,
  initialExpanded = 2,
  showControls = true
}) {
  const { resolvedTheme } = useTheme();
  const isDark = resolvedTheme === "dark";
  const [expandState, setExpandState] = useState(initialExpanded);
  const [viewKey, setViewKey] = useState(0);
  const handleExpandAll = useCallback(() => {
    setExpandState("all");
    setViewKey((k) => k + 1);
  }, []);
  const handleCollapseAll = useCallback(() => {
    setExpandState("none");
    setViewKey((k) => k + 1);
  }, []);
  const handleCopy = useCallback(() => {
    navigator.clipboard.writeText(JSON.stringify(data, null, 2));
  }, [data]);
  const shouldExpandNode = expandState === "all" ? allExpanded : expandState === "none" ? collapseAllNested : (level) => level < expandState;
  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col", className), children: [
    showControls && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 mb-2", "data-cy": "json-viewer-controls", children: [
      /* @__PURE__ */ jsxs(
        Button,
        {
          variant: "ghost",
          size: "sm",
          onClick: handleExpandAll,
          className: "h-7 px-2 text-xs",
          "data-cy": "json-viewer-expand-all",
          children: [
            /* @__PURE__ */ jsx(ChevronsUpDown, { className: "h-3.5 w-3.5 mr-1" }),
            "Expand"
          ]
        }
      ),
      /* @__PURE__ */ jsxs(
        Button,
        {
          variant: "ghost",
          size: "sm",
          onClick: handleCollapseAll,
          className: "h-7 px-2 text-xs",
          "data-cy": "json-viewer-collapse-all",
          children: [
            /* @__PURE__ */ jsx(ChevronsDownUp, { className: "h-3.5 w-3.5 mr-1" }),
            "Collapse"
          ]
        }
      ),
      /* @__PURE__ */ jsxs(
        Button,
        {
          variant: "ghost",
          size: "sm",
          onClick: handleCopy,
          className: "h-7 px-2 text-xs",
          title: "Copy to clipboard",
          "data-cy": "json-viewer-copy",
          children: [
            /* @__PURE__ */ jsx(Copy, { className: "h-3.5 w-3.5 mr-1" }),
            "Copy"
          ]
        }
      )
    ] }),
    /* @__PURE__ */ jsx("div", { className: "font-mono text-sm flex-1 overflow-auto", children: /* @__PURE__ */ jsx(
      JsonView,
      {
        data,
        shouldExpandNode,
        style: isDark ? darkStyles : defaultStyles
      },
      viewKey
    ) })
  ] });
}
export {
  JsonViewer,
  JsonViewerWithControls
};
