@marlinjai/clearify 1.6.1 → 1.6.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marlinjai/clearify",
-  "version": "1.6.1",
+  "version": "1.6.3",
   "description": "An open-source documentation site generator. Turn markdown into beautiful docs.",
   "type": "module",
   "bin": {

package/src/theme/Sidebar.tsx

@@ -1,5 +1,5 @@
 import React, { useState, useEffect, useRef } from 'react';
-import { Link, useLocation } from 'react-router-dom';
+import { Link, useLocation, useNavigate } from 'react-router-dom';
 import clsx from 'clsx';
 import type { NavigationItem, SectionNavigation } from '../types/index.js';
 
@@ -46,6 +46,18 @@ function collectGroupKeys(items: NavigationItem[], prefix = ''): string[] {
   });
 }
 
+/** Walk the navigation tree depth-first and return the first leaf path. */
+function findFirstPath(items: NavigationItem[]): string | undefined {
+  for (const item of items) {
+    if (item.path) return item.path;
+    if (item.children) {
+      const found = findFirstPath(item.children);
+      if (found) return found;
+    }
+  }
+  return undefined;
+}
+
 function SectionSwitcher({
   sections,
   activeId,
@@ -93,6 +105,7 @@ function SectionSwitcher({
 
 export function Sidebar({ sections, open, onClose }: SidebarProps) {
   const location = useLocation();
+  const navigate = useNavigate();
 
   const isSectionData = sections.length > 0 && sections[0]?.id != null && Array.isArray(sections[0]?.navigation);
   const legacyNavigation = !isSectionData ? (sections as unknown as NavigationItem[]) : null;
@@ -189,8 +202,14 @@ export function Sidebar({ sections, open, onClose }: SidebarProps) {
     });
   };
 
-  const handleExpandAll = () => setExpandedGroups(new Set(allGroupKeys));
-  const handleCollapseAll = () => setExpandedGroups(new Set());
+  const handleExpandAll = () => {
+    setExpandedGroups(new Set(allGroupKeys));
+    window.dispatchEvent(new CustomEvent('clearify:expand-all'));
+  };
+  const handleCollapseAll = () => {
+    setExpandedGroups(new Set());
+    window.dispatchEvent(new CustomEvent('clearify:collapse-all'));
+  };
 
   return (
     <>
@@ -231,7 +250,16 @@ export function Sidebar({ sections, open, onClose }: SidebarProps) {
           <SectionSwitcher
             sections={sections}
             activeId={selectedSectionId}
-            onSelect={setSelectedSectionId}
+            onSelect={(id) => {
+              setSelectedSectionId(id);
+              const section = sections.find((s) => s.id === id);
+              if (section) {
+                const firstPath = findFirstPath(section.navigation) ?? section.basePath;
+                if (firstPath && firstPath !== location.pathname) {
+                  navigate(firstPath);
+                }
+              }
+            }}
           />
         )}
         {hasCollapsibleGroups && (

package/src/theme/components/openapi/TagGroup.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
 import { OperationCard } from './OperationCard.js';
 
 interface TagGroupProps {
@@ -17,6 +17,17 @@ function operationAnchorId(tag: string, method: string, path: string): string {
 export function TagGroup({ tag, description, operations, baseUrl }: TagGroupProps) {
   const [expanded, setExpanded] = useState(true);
 
+  useEffect(() => {
+    const onExpand = () => setExpanded(true);
+    const onCollapse = () => setExpanded(false);
+    window.addEventListener('clearify:expand-all', onExpand);
+    window.addEventListener('clearify:collapse-all', onCollapse);
+    return () => {
+      window.removeEventListener('clearify:expand-all', onExpand);
+      window.removeEventListener('clearify:collapse-all', onCollapse);
+    };
+  }, []);
+
   return (
     <div
       id={`tag/${encodeURIComponent(tag)}`}