"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import Link from "next/link";
import { usePathname } from "next/navigation";
import { cn } from "../../lib/utils/index.js";
import { ChevronRight, FileText, Folder, BookOpen, Search, X } from "lucide-react";
import { useState } from "react";
import { useTranslations } from "next-intl";
import { Input } from "../ui/input.js";
import { THEME_REGISTRY } from "@nextsparkjs/registries/theme-registry";
function DocsSidebar({ sections }) {
  var _a, _b;
  const pathname = usePathname();
  const t = useTranslations("docs");
  const getActiveSection = () => {
    const parts = pathname.split("/").filter(Boolean);
    if (parts[0] === "docs" && parts.length >= 2) {
      return parts[1];
    }
    return null;
  };
  const activeSection = getActiveSection();
  const activeTheme = process.env.NEXT_PUBLIC_ACTIVE_THEME || "default";
  const themeAppConfig = (_a = THEME_REGISTRY[activeTheme]) == null ? void 0 : _a.appConfig;
  const publicConfig = ((_b = themeAppConfig == null ? void 0 : themeAppConfig.docs) == null ? void 0 : _b.public) ?? { enabled: true, open: true, label: "Documentation" };
  const [expandedSections, setExpandedSections] = useState(() => {
    return activeSection ? /* @__PURE__ */ new Set([activeSection]) : /* @__PURE__ */ new Set();
  });
  const [searchQuery, setSearchQuery] = useState("");
  const filterSections = (sections2) => {
    if (!searchQuery.trim()) return sections2;
    const query = searchQuery.toLowerCase().trim();
    return sections2.map((section) => {
      const sectionMatches = section.title.toLowerCase().includes(query);
      const matchingPages = section.pages.filter(
        (page) => page.title.toLowerCase().includes(query)
      );
      if (sectionMatches || matchingPages.length > 0) {
        return {
          ...section,
          pages: sectionMatches ? section.pages : matchingPages
        };
      }
      return null;
    }).filter((section) => section !== null);
  };
  const toggleSection = (slug) => {
    const newExpanded = new Set(expandedSections);
    if (newExpanded.has(slug)) {
      newExpanded.delete(slug);
    } else {
      newExpanded.add(slug);
    }
    setExpandedSections(newExpanded);
  };
  const handleKeyDown = (e, slug) => {
    if (e.key === "Enter" || e.key === " ") {
      e.preventDefault();
      toggleSection(slug);
    }
  };
  const publicSections = filterSections(sections);
  if (!publicConfig.enabled) {
    return null;
  }
  return /* @__PURE__ */ jsxs(
    "nav",
    {
      className: "h-full overflow-y-auto p-4",
      "aria-label": t("sidebar.label"),
      "data-cy": "docs-sidebar-nav",
      children: [
        /* @__PURE__ */ jsxs("div", { className: "mb-6", children: [
          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-2", children: [
            /* @__PURE__ */ jsx(BookOpen, { className: "h-5 w-5 text-primary" }),
            /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold", children: publicConfig.label })
          ] }),
          /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground mb-4", children: t("description") }),
          /* @__PURE__ */ jsxs("div", { className: "relative", children: [
            /* @__PURE__ */ jsx(Search, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" }),
            /* @__PURE__ */ jsx(
              Input,
              {
                type: "text",
                placeholder: t("search.placeholder"),
                value: searchQuery,
                onChange: (e) => setSearchQuery(e.target.value),
                className: "pl-9 pr-9",
                "data-cy": "docs-search-input"
              }
            ),
            searchQuery && /* @__PURE__ */ jsx(
              "button",
              {
                onClick: () => setSearchQuery(""),
                className: "absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground transition-colors",
                "aria-label": t("search.clear"),
                "data-cy": "docs-search-clear",
                children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
              }
            )
          ] })
        ] }),
        searchQuery.trim() && publicSections.length === 0 && /* @__PURE__ */ jsx("div", { className: "text-center py-8 px-4", children: /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: t("search.noResults", { query: searchQuery }) }) }),
        /* @__PURE__ */ jsx("div", { className: "space-y-2", children: publicSections.map((section) => {
          const isExpanded = searchQuery.trim() ? true : expandedSections.has(section.slug);
          const isActive = activeSection === section.slug;
          return /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
            /* @__PURE__ */ jsxs(
              "button",
              {
                onClick: () => toggleSection(section.slug),
                onKeyDown: (e) => handleKeyDown(e, section.slug),
                className: cn(
                  "flex items-center w-full text-left px-2 py-1.5 rounded-md transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
                  isActive ? "bg-primary/10 text-primary font-semibold hover:bg-primary/15" : "hover:bg-accent"
                ),
                "aria-expanded": isExpanded,
                "aria-controls": `section-${section.slug}`,
                "data-cy": `docs-section-toggle-${section.slug}`,
                children: [
                  /* @__PURE__ */ jsx(
                    ChevronRight,
                    {
                      className: cn(
                        "h-4 w-4 mr-1 transition-transform",
                        isExpanded && "rotate-90"
                      ),
                      "aria-hidden": "true"
                    }
                  ),
                  /* @__PURE__ */ jsx(Folder, { className: cn(
                    "h-4 w-4 mr-2",
                    isActive && "text-primary"
                  ), "aria-hidden": "true" }),
                  /* @__PURE__ */ jsx("span", { className: "text-sm font-medium flex-1", children: section.title })
                ]
              }
            ),
            isExpanded && /* @__PURE__ */ jsx(
              "div",
              {
                className: "ml-6 space-y-0.5",
                id: `section-${section.slug}`,
                "data-cy": `docs-section-pages-${section.slug}`,
                children: section.pages.map((page) => {
                  const href = `/docs/${section.slug}/${page.slug}`;
                  const isPageActive = pathname === href;
                  return /* @__PURE__ */ jsxs(
                    Link,
                    {
                      href,
                      className: cn(
                        "flex items-center px-2 py-1.5 rounded-md text-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
                        isPageActive ? "bg-accent text-accent-foreground font-medium" : "hover:bg-accent/50"
                      ),
                      "aria-current": isPageActive ? "page" : void 0,
                      "data-cy": `docs-page-link-${page.slug}`,
                      children: [
                        /* @__PURE__ */ jsx(FileText, { className: "h-3.5 w-3.5 mr-2", "aria-hidden": "true" }),
                        /* @__PURE__ */ jsx("span", { children: page.title })
                      ]
                    },
                    page.slug
                  );
                })
              }
            )
          ] }, section.slug);
        }) })
      ]
    }
  );
}
export {
  DocsSidebar
};
