From f40425dd1d6eeaad5573013a05cb774ce74be182 Mon Sep 17 00:00:00 2001
From: martyanov-av <martyanov-av@yandex-team.ru>
Date: Wed, 6 Nov 2024 17:20:24 +0300
Subject: [PATCH] feat: **BREAKING!** enable mobile toc through legacyToc prop

---
 src/components/DocLayout/DocLayout.scss | 8 ++++++++
 src/components/DocLayout/DocLayout.tsx  | 4 +++-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/components/DocLayout/DocLayout.scss b/src/components/DocLayout/DocLayout.scss
index 2fd9d834..c5090b33 100644
--- a/src/components/DocLayout/DocLayout.scss
+++ b/src/components/DocLayout/DocLayout.scss
@@ -134,6 +134,14 @@
             }
         }
 
+        &__legacy-toc {
+            position: static;
+            left: auto;
+            width: 100%;
+
+            border-right: none;
+        }
+
         &__toc {
             position: static;
             width: 100%;
diff --git a/src/components/DocLayout/DocLayout.tsx b/src/components/DocLayout/DocLayout.tsx
index 89250da8..9cea2a6f 100644
--- a/src/components/DocLayout/DocLayout.tsx
+++ b/src/components/DocLayout/DocLayout.tsx
@@ -28,6 +28,7 @@ export interface DocLayoutProps {
     loading?: boolean;
     footer?: React.ReactNode;
     singlePage?: boolean;
+    legacyToc?: boolean;
     onChangeSinglePage?: (value: boolean) => void;
     pdfLink?: string;
 }
@@ -46,6 +47,7 @@ export class DocLayout extends React.Component<DocLayoutProps> {
             hideRight = false,
             loading = false,
             footer = null,
+            legacyToc = false,
         } = this.props;
         let left, center, right;
         const modes = {
@@ -78,7 +80,7 @@ export class DocLayout extends React.Component<DocLayoutProps> {
                 {/* layout direction reverses on mobiles */}
                 <div className={b('mobile-only')}>{footer}</div>
                 {fullScreen ? null : (
-                    <div className={b('left', modes)}>
+                    <div className={b('left', modes, legacyToc ? b('legacy-toc') : undefined)}>
                         {this.renderToc()}
                         {left}
                     </div>