Merge pull request #23333 from storybookjs/revert-23142-shilman/toc-p…

…roof-of-concept Revert "Addon-docs: Add opt-in table of contents"
storybookjs · Jul 6, 2023 · 97a2b89 · 97a2b89
2 parents fbd6bf8 + deeac77
commit 97a2b89
Show file tree

Hide file tree

Showing 11 changed files with 6 additions and 278 deletions.
diff --git a/code/addons/docs/template/stories/toc/basic.stories.ts b/code/addons/docs/template/stories/toc/basic.stories.ts
diff --git a/code/addons/docs/template/stories/toc/custom-selector.stories.ts b/code/addons/docs/template/stories/toc/custom-selector.stories.ts
diff --git a/code/addons/docs/template/stories/toc/custom-title.stories.ts b/code/addons/docs/template/stories/toc/custom-title.stories.ts
diff --git a/code/addons/docs/template/stories/toc/ignore-selector.stories.ts b/code/addons/docs/template/stories/toc/ignore-selector.stories.ts
diff --git a/code/builders/builder-manager/src/index.ts b/code/builders/builder-manager/src/index.ts
@@ -190,6 +190,7 @@ const starter: StarterFunction = async function* starterGeneratorFn({
     }
   });
   router.use(`/index.html`, ({ path }, res) => {
+    console.log({ path });
     res.status(200).send(html);
   });
 

diff --git a/code/ui/.storybook/preview.tsx b/code/ui/.storybook/preview.tsx
@@ -277,7 +277,6 @@ export const parameters = {
   },
   docs: {
     theme: themes.light,
-    toc: {},
   },
   controls: {
     presetColors: [

diff --git a/code/ui/blocks/package.json b/code/ui/blocks/package.json
@@ -63,7 +63,6 @@
     "polished": "^4.2.2",
     "react-colorful": "^5.1.2",
     "telejson": "^7.0.3",
-    "tocbot": "^4.20.1",
     "ts-dedent": "^2.0.0",
     "util-deprecate": "^1.0.2"
   },

diff --git a/code/ui/blocks/src/blocks/DocsContainer.tsx b/code/ui/blocks/src/blocks/DocsContainer.tsx
@@ -9,7 +9,6 @@ import type { DocsContextProps } from './DocsContext';
 import { DocsContext } from './DocsContext';
 import { SourceContainer } from './SourceContainer';
 import { scrollToElement } from './utils';
-import { TableOfContents } from '../components/TableOfContents';
 
 const { document, window: globalWindow } = global;
 
@@ -23,16 +22,6 @@ export const DocsContainer: FC<PropsWithChildren<DocsContainerProps>> = ({
   theme,
   children,
 }) => {
-  let toc;
-
-  try {
-    const meta = context.resolveOf('meta', ['meta']);
-    toc = meta.preparedMeta.parameters?.docs?.toc;
-  } catch (err) {
-    // No meta, falling back to project annotations
-    toc = context?.projectAnnotations?.parameters?.docs?.toc;
-  }
-
   useEffect(() => {
     let url;
     try {
@@ -55,11 +44,7 @@ export const DocsContainer: FC<PropsWithChildren<DocsContainerProps>> = ({
     <DocsContext.Provider value={context}>
       <SourceContainer channel={context.channel}>
         <ThemeProvider theme={ensureTheme(theme)}>
-          <DocsPageWrapper
-            toc={toc ? <TableOfContents className="sbdocs sbdocs-toc--custom" {...toc} /> : null}
-          >
-            {children}
-          </DocsPageWrapper>
+          <DocsPageWrapper>{children}</DocsPageWrapper>
         </ThemeProvider>
       </SourceContainer>
     </DocsContext.Provider>

diff --git a/code/ui/blocks/src/components/DocsPage.tsx b/code/ui/blocks/src/components/DocsPage.tsx
@@ -1,9 +1,9 @@
-import type { FC } from 'react';
-import React from 'react';
-import { transparentize } from 'polished';
 import { withReset } from '@storybook/components';
 import type { CSSObject } from '@storybook/theming';
 import { styled } from '@storybook/theming';
+import { transparentize } from 'polished';
+import type { FC } from 'react';
+import React from 'react';
 
 /**
  * This selector styles all raw elements inside the DocsPage like this example with a `<div/>`:
@@ -429,19 +429,16 @@ export const DocsWrapper = styled.div(({ theme }) => ({
   padding: '4rem 20px',
   minHeight: '100vh',
   boxSizing: 'border-box',
-  gap: '3rem',
 
   [`@media (min-width: ${breakpoint}px)`]: {},
 }));
 
 interface DocsPageWrapperProps {
   children?: React.ReactNode;
-  toc?: React.ReactNode;
 }
 
-export const DocsPageWrapper: FC<DocsPageWrapperProps> = ({ children, toc }) => (
+export const DocsPageWrapper: FC<DocsPageWrapperProps> = ({ children }) => (
   <DocsWrapper className="sbdocs sbdocs-wrapper">
     <DocsContent className="sbdocs sbdocs-content">{children}</DocsContent>
-    {toc}
   </DocsWrapper>
 );
diff --git a/code/ui/blocks/src/components/TableOfContents.tsx b/code/ui/blocks/src/components/TableOfContents.tsx
diff --git a/code/yarn.lock b/code/yarn.lock
@@ -5802,7 +5802,6 @@ __metadata:
     polished: ^4.2.2
     react-colorful: ^5.1.2
     telejson: ^7.0.3
-    tocbot: ^4.20.1
     ts-dedent: ^2.0.0
     util-deprecate: ^1.0.2
   peerDependencies:
@@ -29219,13 +29218,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"tocbot@npm:^4.20.1":
-  version: 4.21.0
-  resolution: "tocbot@npm:4.21.0"
-  checksum: 877d99df40c07ec5e5c2259b820be9c8af9a9f52d582a61b7bed3d43daff820f23031bc613a5cc3bb14ecc34b79c1a45349dcbae8f3a79de7ecc127f366ed3c6
-  languageName: node
-  linkType: hard
-
 "toggle-selection@npm:^1.0.6":
   version: 1.0.6
   resolution: "toggle-selection@npm:1.0.6"