ardo 2.4.1 → 2.6.0

package/dist/chunk-ZPYFCNRO.js

@@ -0,0 +1,742 @@
+import {
+  Content
+} from "./chunk-6MXVILOZ.js";
+import {
+  ChevronDownIcon,
+  GithubIcon,
+  LinkedinIcon,
+  MessageCircleIcon,
+  MonitorIcon,
+  MoonIcon,
+  PackageIcon,
+  SunIcon,
+  TwitterIcon,
+  YoutubeIcon
+} from "./chunk-MJQGGJQZ.js";
+import {
+  useConfig,
+  usePageData,
+  useTOC,
+  useThemeConfig
+} from "./chunk-QELSOHIY.js";
+
+// src/ui/Layout.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function Layout({ header, sidebar, footer, children, className }) {
+  return /* @__PURE__ */ jsxs("div", { className: className ?? "ardo-layout", children: [
+    /* @__PURE__ */ jsx("a", { href: "#main-content", className: "ardo-skip-link", children: "Skip to content" }),
+    header,
+    /* @__PURE__ */ jsxs("div", { className: "ardo-layout-container", children: [
+      sidebar,
+      /* @__PURE__ */ jsx("main", { id: "main-content", className: "ardo-main", children })
+    ] }),
+    footer
+  ] });
+}
+
+// src/ui/Header.tsx
+import { useState as useState2, lazy, Suspense } from "react";
+import { Link } from "react-router";
+
+// src/ui/components/ThemeToggle.tsx
+import { useState, useEffect } from "react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function ThemeToggle() {
+  const [theme, setTheme] = useState("system");
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => {
+    setMounted(true);
+    const stored = localStorage.getItem("ardo-theme");
+    if (stored) {
+      setTheme(stored);
+      applyTheme(stored);
+    } else {
+      applyTheme("system");
+    }
+  }, []);
+  const toggleTheme = () => {
+    const nextTheme = theme === "light" ? "dark" : theme === "dark" ? "system" : "light";
+    setTheme(nextTheme);
+    localStorage.setItem("ardo-theme", nextTheme);
+    applyTheme(nextTheme);
+  };
+  if (!mounted) {
+    return /* @__PURE__ */ jsx2("button", { className: "ardo-theme-toggle", "aria-label": "Toggle theme", children: /* @__PURE__ */ jsx2("span", { className: "ardo-theme-icon", children: /* @__PURE__ */ jsx2(SunIcon, { size: 20 }) }) });
+  }
+  return /* @__PURE__ */ jsx2(
+    "button",
+    {
+      className: "ardo-theme-toggle",
+      onClick: toggleTheme,
+      "aria-label": `Switch to ${theme === "light" ? "dark" : theme === "dark" ? "system" : "light"} theme`,
+      children: /* @__PURE__ */ jsxs2("span", { className: "ardo-theme-icon", children: [
+        theme === "light" && /* @__PURE__ */ jsx2(SunIcon, { size: 20 }),
+        theme === "dark" && /* @__PURE__ */ jsx2(MoonIcon, { size: 20 }),
+        theme === "system" && /* @__PURE__ */ jsx2(MonitorIcon, { size: 20 })
+      ] })
+    }
+  );
+}
+function applyTheme(theme) {
+  const root = document.documentElement;
+  if (theme === "system") {
+    const isDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
+    root.classList.toggle("dark", isDark);
+    root.classList.toggle("light", !isDark);
+  } else {
+    root.classList.toggle("dark", theme === "dark");
+    root.classList.toggle("light", theme === "light");
+  }
+}
+
+// src/ui/Header.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var LazySearch = lazy(() => import("./Search-MXGJE6PQ.js").then((m) => ({ default: m.Search })));
+function Header({
+  logo,
+  title,
+  nav,
+  actions,
+  search = true,
+  themeToggle = true,
+  className
+}) {
+  const [mobileMenuOpen, setMobileMenuOpen] = useState2(false);
+  return /* @__PURE__ */ jsxs3("header", { className: className ?? "ardo-header", children: [
+    /* @__PURE__ */ jsxs3("div", { className: "ardo-header-container", children: [
+      /* @__PURE__ */ jsxs3("div", { className: "ardo-header-left", children: [
+        /* @__PURE__ */ jsx3(
+          "button",
+          {
+            className: "ardo-mobile-menu-button",
+            onClick: () => setMobileMenuOpen(!mobileMenuOpen),
+            "aria-label": "Toggle menu",
+            "aria-expanded": mobileMenuOpen,
+            children: /* @__PURE__ */ jsxs3("span", { className: "ardo-hamburger", children: [
+              /* @__PURE__ */ jsx3("span", {}),
+              /* @__PURE__ */ jsx3("span", {}),
+              /* @__PURE__ */ jsx3("span", {})
+            ] })
+          }
+        ),
+        /* @__PURE__ */ jsxs3(Link, { to: "/", className: "ardo-logo-link", children: [
+          logo && /* @__PURE__ */ jsx3(
+            "img",
+            {
+              src: typeof logo === "string" ? logo : logo.light,
+              alt: title ?? "Logo",
+              className: "ardo-logo"
+            }
+          ),
+          title && /* @__PURE__ */ jsx3("span", { className: "ardo-site-title", children: title })
+        ] })
+      ] }),
+      nav && /* @__PURE__ */ jsx3("div", { className: "ardo-nav", children: nav }),
+      /* @__PURE__ */ jsxs3("div", { className: "ardo-header-right", children: [
+        search && /* @__PURE__ */ jsx3(Suspense, { fallback: /* @__PURE__ */ jsx3("span", { className: "ardo-search-placeholder" }), children: /* @__PURE__ */ jsx3(LazySearch, {}) }),
+        themeToggle && /* @__PURE__ */ jsx3(ThemeToggle, {}),
+        actions
+      ] })
+    ] }),
+    mobileMenuOpen && /* @__PURE__ */ jsx3("div", { className: "ardo-mobile-menu", children: /* @__PURE__ */ jsx3("nav", { className: "ardo-mobile-nav", onClick: () => setMobileMenuOpen(false), children: nav }) })
+  ] });
+}
+function SocialLink({ href, icon, ariaLabel, className }) {
+  return /* @__PURE__ */ jsx3(
+    "a",
+    {
+      href,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      className: className ?? "ardo-social-link",
+      "aria-label": ariaLabel ?? icon,
+      children: /* @__PURE__ */ jsx3(SocialIcon, { icon })
+    }
+  );
+}
+var socialIcons = {
+  github: GithubIcon,
+  twitter: TwitterIcon,
+  discord: MessageCircleIcon,
+  linkedin: LinkedinIcon,
+  youtube: YoutubeIcon,
+  npm: PackageIcon
+};
+function SocialIcon({ icon }) {
+  const IconComponent = socialIcons[icon] ?? GithubIcon;
+  return /* @__PURE__ */ jsx3(IconComponent, { size: 20 });
+}
+
+// src/ui/Sidebar.tsx
+import {
+  useState as useState3,
+  Children,
+  isValidElement,
+  createContext,
+  useContext
+} from "react";
+import { NavLink, useLocation } from "react-router";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var SidebarContext = createContext({ currentPath: "" });
+function useSidebarContext() {
+  return useContext(SidebarContext);
+}
+function Sidebar({ items, children, className }) {
+  const { pathname } = useLocation();
+  return /* @__PURE__ */ jsx4(SidebarContext.Provider, { value: { currentPath: pathname }, children: /* @__PURE__ */ jsx4("aside", { className: className ?? "ardo-sidebar", children: /* @__PURE__ */ jsx4("nav", { className: "ardo-sidebar-nav", "aria-label": "Main navigation", children: items ? /* @__PURE__ */ jsx4(SidebarItems, { items, depth: 0 }) : /* @__PURE__ */ jsx4("ul", { className: "ardo-sidebar-list ardo-sidebar-list-0", children }) }) }) });
+}
+function SidebarGroup({
+  title,
+  to,
+  collapsed: initialCollapsed = false,
+  collapsible = true,
+  children,
+  className
+}) {
+  const [collapsed, setCollapsed] = useState3(initialCollapsed);
+  const { currentPath } = useSidebarContext();
+  const isChildActive = checkChildrenActive(children, currentPath);
+  const textClassName = ["ardo-sidebar-text", isChildActive && "child-active"].filter(Boolean).join(" ");
+  const hasChildren = Children.count(children) > 0;
+  return /* @__PURE__ */ jsxs4("li", { className: className ?? "ardo-sidebar-item", children: [
+    /* @__PURE__ */ jsxs4("div", { className: "ardo-sidebar-item-header", children: [
+      to ? /* @__PURE__ */ jsx4(
+        NavLink,
+        {
+          to,
+          end: true,
+          className: ({ isActive }) => [textClassName, isActive && "active"].filter(Boolean).join(" "),
+          children: title
+        }
+      ) : /* @__PURE__ */ jsx4(
+        "span",
+        {
+          className: textClassName,
+          onClick: () => collapsible && hasChildren && setCollapsed(!collapsed),
+          style: collapsible && hasChildren ? { cursor: "pointer" } : void 0,
+          children: title
+        }
+      ),
+      collapsible && hasChildren && /* @__PURE__ */ jsx4(
+        "button",
+        {
+          className: ["ardo-sidebar-collapse", collapsed && "collapsed"].filter(Boolean).join(" "),
+          onClick: () => setCollapsed(!collapsed),
+          "aria-label": collapsed ? "Expand" : "Collapse",
+          children: /* @__PURE__ */ jsx4(ChevronDownIcon, { size: 16 })
+        }
+      )
+    ] }),
+    hasChildren && !collapsed && /* @__PURE__ */ jsx4("ul", { className: "ardo-sidebar-list ardo-sidebar-list-1", children })
+  ] });
+}
+function SidebarLink({ to, children, className }) {
+  const baseClassName = className ?? "ardo-sidebar-link";
+  return /* @__PURE__ */ jsx4("li", { className: "ardo-sidebar-item", children: /* @__PURE__ */ jsx4(
+    NavLink,
+    {
+      to,
+      className: ({ isActive }) => [baseClassName, isActive && "active"].filter(Boolean).join(" "),
+      children
+    }
+  ) });
+}
+function SidebarItems({ items, depth }) {
+  return /* @__PURE__ */ jsx4("ul", { className: `ardo-sidebar-list ardo-sidebar-list-${depth}`, children: items.map((item, index) => /* @__PURE__ */ jsx4(SidebarItemComponent, { item, depth }, index)) });
+}
+function SidebarItemComponent({ item, depth }) {
+  const { currentPath } = useSidebarContext();
+  const [collapsed, setCollapsed] = useState3(item.collapsed ?? false);
+  const hasChildren = item.items && item.items.length > 0;
+  const isChildActive = hasChildren && item.items.some(
+    (child) => child.link === currentPath || child.items && child.items.some((grandchild) => grandchild.link === currentPath)
+  );
+  const linkClassName = ["ardo-sidebar-link", isChildActive && "child-active"].filter(Boolean).join(" ");
+  const textClassName = ["ardo-sidebar-text", isChildActive && "child-active"].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs4("li", { className: "ardo-sidebar-item", children: [
+    /* @__PURE__ */ jsxs4("div", { className: "ardo-sidebar-item-header", children: [
+      item.link ? /* @__PURE__ */ jsx4(
+        NavLink,
+        {
+          to: item.link,
+          className: ({ isActive }) => [linkClassName, isActive && "active"].filter(Boolean).join(" "),
+          children: item.text
+        }
+      ) : /* @__PURE__ */ jsx4("span", { className: textClassName, onClick: () => hasChildren && setCollapsed(!collapsed), children: item.text }),
+      hasChildren && /* @__PURE__ */ jsx4(
+        "button",
+        {
+          className: ["ardo-sidebar-collapse", collapsed && "collapsed"].filter(Boolean).join(" "),
+          onClick: () => setCollapsed(!collapsed),
+          "aria-label": collapsed ? "Expand" : "Collapse",
+          children: /* @__PURE__ */ jsx4(ChevronDownIcon, { size: 16 })
+        }
+      )
+    ] }),
+    hasChildren && !collapsed && /* @__PURE__ */ jsx4(SidebarItems, { items: item.items, depth: depth + 1 })
+  ] });
+}
+function checkChildrenActive(children, currentPath) {
+  let isActive = false;
+  Children.forEach(children, (child) => {
+    if (isActive) return;
+    if (isValidElement(child)) {
+      if (child.type === SidebarLink && child.props.to === currentPath) {
+        isActive = true;
+        return;
+      }
+      if (child.type === SidebarGroup) {
+        const groupProps = child.props;
+        if (groupProps.to === currentPath) {
+          isActive = true;
+          return;
+        }
+        if (groupProps.children && checkChildrenActive(groupProps.children, currentPath)) {
+          isActive = true;
+          return;
+        }
+      }
+    }
+  });
+  return isActive;
+}
+
+// src/ui/Footer.tsx
+import { Fragment, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+function formatBuildTime(iso) {
+  try {
+    const date = new Date(iso);
+    return date.toLocaleDateString("en-US", {
+      month: "long",
+      day: "numeric",
+      year: "numeric"
+    });
+  } catch {
+    return iso;
+  }
+}
+function Footer({
+  message,
+  copyright,
+  children,
+  className,
+  project,
+  sponsor,
+  buildTime,
+  buildHash,
+  ardoLink = true
+}) {
+  const hasContent = message || copyright || children || project || sponsor || buildTime || ardoLink;
+  if (!hasContent) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx5("footer", { className: className ?? "ardo-footer", children: /* @__PURE__ */ jsx5("div", { className: "ardo-footer-container", children: children ?? /* @__PURE__ */ jsxs5(Fragment, { children: [
+    (project || ardoLink || sponsor) && /* @__PURE__ */ jsxs5("p", { className: "ardo-footer-primary", children: [
+      project?.name && /* @__PURE__ */ jsx5(Fragment, { children: project.homepage ? /* @__PURE__ */ jsxs5("a", { href: project.homepage, className: "ardo-footer-link", children: [
+        project.name,
+        project.version ? ` v${project.version}` : ""
+      ] }) : /* @__PURE__ */ jsxs5("span", { children: [
+        project.name,
+        project.version ? ` v${project.version}` : ""
+      ] }) }),
+      project?.name && ardoLink && /* @__PURE__ */ jsx5("span", { className: "ardo-footer-separator", "aria-hidden": "true" }),
+      ardoLink && /* @__PURE__ */ jsx5("a", { href: "https://ardo-docs.dev", className: "ardo-footer-link", children: "Built with Ardo" }),
+      (project?.name || ardoLink) && sponsor && /* @__PURE__ */ jsx5("span", { className: "ardo-footer-separator", "aria-hidden": "true" }),
+      sponsor && /* @__PURE__ */ jsxs5("a", { href: sponsor.link, className: "ardo-footer-link", children: [
+        "Sponsored by ",
+        sponsor.text
+      ] })
+    ] }),
+    message && /* @__PURE__ */ jsx5("p", { className: "ardo-footer-message", dangerouslySetInnerHTML: { __html: message } }),
+    copyright && /* @__PURE__ */ jsx5(
+      "p",
+      {
+        className: "ardo-footer-copyright",
+        dangerouslySetInnerHTML: { __html: copyright }
+      }
+    ),
+    buildTime && /* @__PURE__ */ jsxs5("p", { className: "ardo-footer-build-time", children: [
+      "Built on ",
+      formatBuildTime(buildTime),
+      buildHash && /* @__PURE__ */ jsxs5(Fragment, { children: [
+        " (",
+        buildHash,
+        ")"
+      ] })
+    ] })
+  ] }) }) });
+}
+
+// src/ui/Nav.tsx
+import { useState as useState4, createContext as createContext2, useContext as useContext2 } from "react";
+import { NavLink as RouterNavLink } from "react-router";
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+var NavContext = createContext2(null);
+function useNavContext() {
+  return useContext2(NavContext);
+}
+function Nav({ children, className }) {
+  return /* @__PURE__ */ jsx6("nav", { className: className ?? "ardo-nav", children });
+}
+function NavLink2({
+  to,
+  href,
+  children,
+  className,
+  activeMatch: _activeMatch
+}) {
+  const navContext = useNavContext();
+  const baseClassName = className ?? "ardo-nav-link";
+  const handleClick = () => {
+    navContext?.setMobileMenuOpen(false);
+  };
+  if (href) {
+    return /* @__PURE__ */ jsx6(
+      "a",
+      {
+        href,
+        className: baseClassName,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        onClick: handleClick,
+        children
+      }
+    );
+  }
+  if (to) {
+    return /* @__PURE__ */ jsx6(
+      RouterNavLink,
+      {
+        to,
+        className: ({ isActive }) => [baseClassName, isActive && "active"].filter(Boolean).join(" "),
+        onClick: handleClick,
+        children
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx6("span", { className: baseClassName, children });
+}
+function NavDropdown({ text, children, className }) {
+  const [open, setOpen] = useState4(false);
+  return /* @__PURE__ */ jsxs6(
+    "div",
+    {
+      className: className ?? "ardo-nav-dropdown",
+      onMouseEnter: () => setOpen(true),
+      onMouseLeave: () => setOpen(false),
+      children: [
+        /* @__PURE__ */ jsxs6("button", { className: "ardo-nav-dropdown-button", children: [
+          text,
+          /* @__PURE__ */ jsx6("span", { className: "ardo-nav-dropdown-icon", children: "\u25BC" })
+        ] }),
+        open && /* @__PURE__ */ jsx6("div", { className: "ardo-nav-dropdown-menu", children })
+      ]
+    }
+  );
+}
+
+// src/ui/TOC.tsx
+import { useState as useState5, useEffect as useEffect2 } from "react";
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+function TOC() {
+  const toc = useTOC();
+  const themeConfig = useThemeConfig();
+  const [activeId, setActiveId] = useState5("");
+  const label = themeConfig.outline?.label ?? "On this page";
+  useEffect2(() => {
+    if (toc.length === 0) return;
+    const headingElements = toc.map((item) => document.getElementById(item.id)).filter(Boolean);
+    if (headingElements.length === 0) return;
+    const observer = new IntersectionObserver(
+      (entries) => {
+        for (const entry of entries) {
+          if (entry.isIntersecting) {
+            setActiveId(entry.target.id);
+            break;
+          }
+        }
+      },
+      {
+        rootMargin: "-80px 0px -80% 0px",
+        threshold: 0
+      }
+    );
+    headingElements.forEach((el) => el && observer.observe(el));
+    return () => {
+      headingElements.forEach((el) => el && observer.unobserve(el));
+    };
+  }, [toc]);
+  if (toc.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx7("aside", { className: "ardo-toc", children: /* @__PURE__ */ jsxs7("div", { className: "ardo-toc-container", children: [
+    /* @__PURE__ */ jsx7("h3", { className: "ardo-toc-title", children: label }),
+    /* @__PURE__ */ jsx7("nav", { className: "ardo-toc-nav", "aria-label": "Table of contents", children: /* @__PURE__ */ jsx7(TOCItems, { items: toc, activeId }) })
+  ] }) });
+}
+function TOCItems({ items, activeId }) {
+  return /* @__PURE__ */ jsx7("ul", { className: "ardo-toc-list", children: items.map((item) => /* @__PURE__ */ jsx7(TOCItemComponent, { item, activeId }, item.id)) });
+}
+function TOCItemComponent({ item, activeId }) {
+  const isActive = item.id === activeId;
+  const hasActiveChild = hasActiveDescendant(item, activeId);
+  return /* @__PURE__ */ jsxs7("li", { className: "ardo-toc-item", children: [
+    /* @__PURE__ */ jsx7(
+      "a",
+      {
+        href: `#${item.id}`,
+        className: [
+          `ardo-toc-link ardo-toc-link-${item.level}`,
+          isActive && "active",
+          hasActiveChild && "child-active"
+        ].filter(Boolean).join(" "),
+        onClick: (e) => {
+          e.preventDefault();
+          const element = document.getElementById(item.id);
+          if (element) {
+            element.scrollIntoView({ behavior: "smooth" });
+            window.history.pushState(null, "", `#${item.id}`);
+          }
+        },
+        children: item.text
+      }
+    ),
+    item.children && item.children.length > 0 && /* @__PURE__ */ jsx7(TOCItems, { items: item.children, activeId })
+  ] });
+}
+function hasActiveDescendant(item, activeId) {
+  if (!item.children) return false;
+  for (const child of item.children) {
+    if (child.id === activeId) return true;
+    if (hasActiveDescendant(child, activeId)) return true;
+  }
+  return false;
+}
+
+// src/ui/DocPage.tsx
+import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+function DocPage({ children }) {
+  const pageData = usePageData();
+  const showToc = pageData?.frontmatter.outline !== false && pageData?.toc && pageData.toc.length > 0;
+  return /* @__PURE__ */ jsx8(Layout, { children: /* @__PURE__ */ jsxs8("div", { className: "ardo-doc-page", children: [
+    /* @__PURE__ */ jsx8(Content, { children }),
+    showToc && /* @__PURE__ */ jsx8(TOC, {})
+  ] }) });
+}
+function DocContent({ children }) {
+  const pageData = usePageData();
+  const showToc = pageData?.frontmatter.outline !== false && pageData?.toc && pageData.toc.length > 0;
+  return /* @__PURE__ */ jsxs8("div", { className: "ardo-doc-page", children: [
+    /* @__PURE__ */ jsx8(Content, { children }),
+    showToc && /* @__PURE__ */ jsx8(TOC, {})
+  ] });
+}
+function DocLayout({ content }) {
+  return /* @__PURE__ */ jsx8(DocPage, { children: content });
+}
+
+// src/ui/HomePage.tsx
+import { Link as Link2 } from "react-router";
+import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
+function HomePage() {
+  const pageData = usePageData();
+  const config = useConfig();
+  const themeConfig = useThemeConfig();
+  const hero = pageData?.frontmatter.hero;
+  const features = pageData?.frontmatter.features;
+  return /* @__PURE__ */ jsxs9("div", { className: "ardo-home", children: [
+    /* @__PURE__ */ jsx9(
+      Header,
+      {
+        logo: themeConfig.logo,
+        title: themeConfig.siteTitle !== false ? config.title : void 0,
+        nav: themeConfig.nav && themeConfig.nav.length > 0 ? /* @__PURE__ */ jsx9(Nav, { children: themeConfig.nav.map((item, index) => /* @__PURE__ */ jsx9(NavLink2, { to: item.link, children: item.text }, index)) }) : void 0,
+        actions: themeConfig.socialLinks?.map((link, index) => /* @__PURE__ */ jsx9(SocialLink, { href: link.link, icon: link.icon, ariaLabel: link.ariaLabel }, index))
+      }
+    ),
+    /* @__PURE__ */ jsxs9("main", { className: "ardo-home-main", children: [
+      hero && /* @__PURE__ */ jsx9("section", { className: "ardo-hero", children: /* @__PURE__ */ jsxs9("div", { className: "ardo-hero-container", children: [
+        hero.image && /* @__PURE__ */ jsx9("div", { className: "ardo-hero-image", children: /* @__PURE__ */ jsx9(
+          "img",
+          {
+            src: typeof hero.image === "string" ? hero.image : hero.image.light,
+            alt: hero.name || config.title
+          }
+        ) }),
+        /* @__PURE__ */ jsxs9("div", { className: "ardo-hero-content", children: [
+          hero.name && /* @__PURE__ */ jsx9("h1", { className: "ardo-hero-name", children: hero.name }),
+          hero.text && /* @__PURE__ */ jsx9("p", { className: "ardo-hero-text", children: hero.text }),
+          hero.tagline && /* @__PURE__ */ jsx9("p", { className: "ardo-hero-tagline", children: hero.tagline }),
+          hero.actions && hero.actions.length > 0 && /* @__PURE__ */ jsx9("div", { className: "ardo-hero-actions", children: hero.actions.map((action, index) => /* @__PURE__ */ jsx9(
+            Link2,
+            {
+              to: action.link,
+              className: `ardo-hero-action ardo-hero-action-${action.theme || "brand"}`,
+              children: action.text
+            },
+            index
+          )) })
+        ] })
+      ] }) }),
+      features && features.length > 0 && /* @__PURE__ */ jsx9("section", { className: "ardo-features", children: /* @__PURE__ */ jsx9("div", { className: "ardo-features-container", children: features.map((feature, index) => /* @__PURE__ */ jsxs9("div", { className: "ardo-feature", children: [
+        feature.icon && /* @__PURE__ */ jsx9("div", { className: "ardo-feature-icon", children: feature.icon }),
+        /* @__PURE__ */ jsx9("h3", { className: "ardo-feature-title", children: feature.title }),
+        /* @__PURE__ */ jsx9("p", { className: "ardo-feature-details", children: feature.details }),
+        feature.link && /* @__PURE__ */ jsx9(Link2, { to: feature.link, className: "ardo-feature-link", children: feature.linkText || "Learn more" })
+      ] }, index)) }) })
+    ] }),
+    /* @__PURE__ */ jsx9(Footer, {})
+  ] });
+}
+
+// src/ui/components/Hero.tsx
+import { Link as Link3 } from "react-router";
+import { Fragment as Fragment2, jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
+function Hero({ name, text, tagline, image, actions, className, version }) {
+  const imageUrl = typeof image === "string" ? image : image?.light;
+  const imageAlt = typeof image === "string" ? name : image?.alt ?? name;
+  return /* @__PURE__ */ jsx10("section", { className: className ?? "ardo-hero", children: /* @__PURE__ */ jsxs10("div", { className: "ardo-hero-container ardo-hero-animate", children: [
+    image && /* @__PURE__ */ jsx10("div", { className: "ardo-hero-image", children: /* @__PURE__ */ jsx10("img", { src: imageUrl, alt: imageAlt }) }),
+    /* @__PURE__ */ jsxs10("div", { className: "ardo-hero-content", children: [
+      version && /* @__PURE__ */ jsxs10("span", { className: "ardo-hero-version", children: [
+        "v",
+        version
+      ] }),
+      name && /* @__PURE__ */ jsx10("h1", { className: "ardo-hero-name", children: name }),
+      text && /* @__PURE__ */ jsx10("p", { className: "ardo-hero-text", children: text }),
+      tagline && /* @__PURE__ */ jsx10("p", { className: "ardo-hero-tagline", children: tagline }),
+      actions && actions.length > 0 && /* @__PURE__ */ jsx10("div", { className: "ardo-hero-actions", children: actions.map((action, index) => {
+        const link = action.link;
+        const isExternal = typeof link === "string" && (link.startsWith("http://") || link.startsWith("https://"));
+        const className2 = `ardo-hero-action ardo-hero-action-${action.theme || "brand"}`;
+        const content = /* @__PURE__ */ jsxs10(Fragment2, { children: [
+          action.icon,
+          action.text
+        ] });
+        if (isExternal) {
+          return /* @__PURE__ */ jsx10(
+            "a",
+            {
+              href: link,
+              className: className2,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              children: content
+            },
+            index
+          );
+        }
+        return /* @__PURE__ */ jsx10(Link3, { to: link, className: className2, children: content }, index);
+      }) })
+    ] })
+  ] }) });
+}
+
+// src/ui/components/Features.tsx
+import { Link as Link4 } from "react-router";
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+function FeatureCard({
+  title,
+  icon,
+  details,
+  link,
+  linkText,
+  className,
+  style
+}) {
+  return /* @__PURE__ */ jsxs11("div", { className: className ?? "ardo-feature", style, children: [
+    icon && /* @__PURE__ */ jsx11("div", { className: "ardo-feature-icon", children: icon }),
+    /* @__PURE__ */ jsx11("h3", { className: "ardo-feature-title", children: title }),
+    /* @__PURE__ */ jsx11("p", { className: "ardo-feature-details", children: details }),
+    link && /* @__PURE__ */ jsx11(Link4, { to: link, className: "ardo-feature-link", children: linkText || "Learn more" })
+  ] });
+}
+function Features({ items, title, subtitle, className }) {
+  if (!items || items.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs11("section", { className: className ?? "ardo-features", children: [
+    (title || subtitle) && /* @__PURE__ */ jsxs11("div", { className: "ardo-features-header", children: [
+      title && /* @__PURE__ */ jsx11("h2", { className: "ardo-features-title", children: title }),
+      subtitle && /* @__PURE__ */ jsx11("p", { className: "ardo-features-subtitle", children: subtitle })
+    ] }),
+    /* @__PURE__ */ jsx11("div", { className: "ardo-features-container", children: items.map((feature, index) => /* @__PURE__ */ jsx11(FeatureCard, { ...feature, style: { animationDelay: `${index * 80}ms` } }, index)) })
+  ] });
+}
+
+// src/ui/components/Steps.tsx
+import { jsx as jsx12 } from "react/jsx-runtime";
+function Steps({ children }) {
+  return /* @__PURE__ */ jsx12("div", { className: "ardo-steps", children });
+}
+
+// src/ui/components/FileTree.tsx
+import {
+  Children as Children2,
+  isValidElement as isValidElement2,
+  cloneElement
+} from "react";
+import { jsx as jsx13 } from "react/jsx-runtime";
+function getTextContent(node) {
+  if (typeof node === "string") return node;
+  if (typeof node === "number") return String(node);
+  if (!isValidElement2(node)) return "";
+  const children = node.props.children;
+  if (!children) return "";
+  return Children2.toArray(children).map(getTextContent).join("");
+}
+function isDirectory(node) {
+  const children = node.props.children;
+  const childArray = Children2.toArray(children);
+  for (const child of childArray) {
+    if (isValidElement2(child) && (child.type === "ul" || child.type === "ol")) {
+      return true;
+    }
+  }
+  const text = getTextContent(node).trim();
+  return text.endsWith("/");
+}
+function processChildren(children) {
+  return Children2.map(children, (child) => {
+    if (!isValidElement2(child)) return child;
+    const props = child.props;
+    const el = child;
+    if (child.type === "li") {
+      const isDir = isDirectory(child);
+      const className = [props.className, isDir ? "ardo-filetree-dir" : "ardo-filetree-file"].filter(Boolean).join(" ");
+      return cloneElement(el, { className }, processChildren(props.children));
+    }
+    if (child.type === "ul" || child.type === "ol") {
+      return cloneElement(el, {}, processChildren(props.children));
+    }
+    return child;
+  });
+}
+function FileTree({ children }) {
+  return /* @__PURE__ */ jsx13("div", { className: "ardo-filetree", children: processChildren(children) });
+}
+
+export {
+  Layout,
+  ThemeToggle,
+  Header,
+  SocialLink,
+  Sidebar,
+  SidebarGroup,
+  SidebarLink,
+  Footer,
+  Nav,
+  NavLink2 as NavLink,
+  NavDropdown,
+  TOC,
+  DocPage,
+  DocContent,
+  DocLayout,
+  HomePage,
+  Hero,
+  FeatureCard,
+  Features,
+  Steps,
+  FileTree
+};
+//# sourceMappingURL=chunk-ZPYFCNRO.js.map