feat(theme-classic): auto-collapse sibling categories in doc sidebar (#3811)

Co-authored-by: Josh-Cena <sidachen2003@gmail.com>

packages/docusaurus-theme-common/src/index.ts

@@ -6,6 +6,10 @@
  */
 
 export {useThemeConfig} from './utils/useThemeConfig';
+export {
+  DocSidebarItemsExpandedStateProvider,
+  useDocSidebarItemsExpandedState,
+} from './utils/docSidebarItemsExpandedState';
 
 export type {
   ThemeConfig,

packages/docusaurus-theme-common/src/utils/docSidebarItemsExpandedState.tsx

@@ -0,0 +1,41 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import React, {type ReactNode, useMemo, useState, useContext} from 'react';
+
+const EmptyContext: unique symbol = Symbol('EmptyContext');
+const Context = React.createContext<
+  DocSidebarItemsExpandedState | typeof EmptyContext
+>(EmptyContext);
+type DocSidebarItemsExpandedState = {
+  expandedItem: number | null;
+  setExpandedItem: (a: number | null) => void;
+};
+
+export function DocSidebarItemsExpandedStateProvider({
+  children,
+}: {
+  children: ReactNode;
+}): JSX.Element {
+  const [expandedItem, setExpandedItem] = useState<number | null>(null);
+  const contextValue = useMemo(
+    () => ({expandedItem, setExpandedItem}),
+    [expandedItem],
+  );
+
+  return <Context.Provider value={contextValue}>{children}</Context.Provider>;
+}
+
+export function useDocSidebarItemsExpandedState(): DocSidebarItemsExpandedState {
+  const contextValue = useContext(Context);
+  if (contextValue === EmptyContext) {
+    throw new Error(
+      'This hook requires usage of <DocSidebarItemsExpandedStateProvider>',
+    );
+  }
+  return contextValue;
+}

packages/docusaurus-theme-common/src/utils/useThemeConfig.ts

@@ -122,6 +122,7 @@ export type ThemeConfig = {
   prism: PrismConfig;
   footer?: Footer;
   hideableSidebar: boolean;
+  autoCollapseSidebarCategories: boolean;
   image?: string;
   metadata: Array<Record<string, string>>;
   sidebarCollapsible: boolean;