Nested list support (#2562)

Author: gregberge

packages/gitbook/src/components/DocumentView/Block.tsx

@@ -22,10 +22,8 @@ import { Heading } from './Heading';
 import { Hint } from './Hint';
 import { Images } from './Images';
 import { IntegrationBlock } from './Integration';
+import { List } from './List';
 import { ListItem } from './ListItem';
-import { ListOrdered } from './ListOrdered';
-import { ListTasks } from './ListTasks';
-import { ListUnordered } from './ListUnordered';
 import { BlockMath } from './Math';
 import { OpenAPI } from './OpenAPI';
 import { Paragraph } from './Paragraph';
@@ -65,11 +63,9 @@ export function Block<T extends DocumentBlock>(props: BlockProps<T>) {
  case 'heading-3':
  return <Heading {...props} block={block} />;
  case 'list-ordered':
- return <ListOrdered {...props} block={block} />;
  case 'list-unordered':
- return <ListUnordered {...props} block={block} />;
  case 'list-tasks':
- return <ListTasks {...props} block={block} />;
+ return <List {...props} block={block} />;
  case 'list-item':
  return <ListItem {...props} block={block} />;
  case 'code':

packages/gitbook/src/components/DocumentView/List.tsx

@@ -0,0 +1,44 @@
+import {
+ DocumentBlockListOrdered,
+ DocumentBlockListTasks,
+ DocumentBlockListUnordered,
+} from '@gitbook/api';
+import assertNever from 'assert-never';
+
+import { BlockProps } from './Block';
+import { Blocks } from './Blocks';
+
+export function List(
+ props: BlockProps<
+ DocumentBlockListUnordered | DocumentBlockListOrdered | DocumentBlockListTasks
+ >,
+) {
+ const { block, style, ancestorBlocks, ...contextProps } = props;
+
+ return (
+ <Blocks
+ {...contextProps}
+ tag={getListTag(block.type)}
+ nodes={block.nodes}
+ ancestorBlocks={[...ancestorBlocks, block]}
+ style={['space-y-2', style]}
+ />
+ );
+}
+
+function getListTag(
+ type:
+ | DocumentBlockListUnordered['type']
+ | DocumentBlockListOrdered['type']
+ | DocumentBlockListTasks['type'],
+) {
+ switch (type) {
+ case 'list-ordered':
+ return 'ol';
+ case 'list-unordered':
+ case 'list-tasks':
+ return 'ul';
+ default:
+ assertNever(type);
+ }
+}