feat: implement indent for list nodes

api/v2/markdown_service.go

@@ -54,13 +54,13 @@ func convertFromASTNode(rawNode ast.Node) *apiv2pb.Node {
 		node.Node = &apiv2pb.Node_BlockquoteNode{BlockquoteNode: &apiv2pb.BlockquoteNode{Children: children}}
 	case *ast.OrderedList:
 		children := convertFromASTNodes(n.Children)
-		node.Node = &apiv2pb.Node_OrderedListNode{OrderedListNode: &apiv2pb.OrderedListNode{Number: n.Number, Children: children}}
+		node.Node = &apiv2pb.Node_OrderedListNode{OrderedListNode: &apiv2pb.OrderedListNode{Number: n.Number, Indent: int32(n.Indent), Children: children}}
 	case *ast.UnorderedList:
 		children := convertFromASTNodes(n.Children)
-		node.Node = &apiv2pb.Node_UnorderedListNode{UnorderedListNode: &apiv2pb.UnorderedListNode{Symbol: n.Symbol, Children: children}}
+		node.Node = &apiv2pb.Node_UnorderedListNode{UnorderedListNode: &apiv2pb.UnorderedListNode{Symbol: n.Symbol, Indent: int32(n.Indent), Children: children}}
 	case *ast.TaskList:
 		children := convertFromASTNodes(n.Children)
-		node.Node = &apiv2pb.Node_TaskListNode{TaskListNode: &apiv2pb.TaskListNode{Symbol: n.Symbol, Complete: n.Complete, Children: children}}
+		node.Node = &apiv2pb.Node_TaskListNode{TaskListNode: &apiv2pb.TaskListNode{Symbol: n.Symbol, Indent: int32(n.Indent), Complete: n.Complete, Children: children}}
 	case *ast.MathBlock:
 		node.Node = &apiv2pb.Node_MathBlockNode{MathBlockNode: &apiv2pb.MathBlockNode{Content: n.Content}}
 	case *ast.Text:
@@ -123,13 +123,13 @@ func convertToASTNode(node *apiv2pb.Node) ast.Node {
 		return &ast.Blockquote{Children: children}
 	case *apiv2pb.Node_OrderedListNode:
 		children := convertToASTNodes(n.OrderedListNode.Children)
-		return &ast.OrderedList{Number: n.OrderedListNode.Number, Children: children}
+		return &ast.OrderedList{Number: n.OrderedListNode.Number, Indent: int(n.OrderedListNode.Indent), Children: children}
 	case *apiv2pb.Node_UnorderedListNode:
 		children := convertToASTNodes(n.UnorderedListNode.Children)
-		return &ast.UnorderedList{Symbol: n.UnorderedListNode.Symbol, Children: children}
+		return &ast.UnorderedList{Symbol: n.UnorderedListNode.Symbol, Indent: int(n.UnorderedListNode.Indent), Children: children}
 	case *apiv2pb.Node_TaskListNode:
 		children := convertToASTNodes(n.TaskListNode.Children)
-		return &ast.TaskList{Symbol: n.TaskListNode.Symbol, Complete: n.TaskListNode.Complete, Children: children}
+		return &ast.TaskList{Symbol: n.TaskListNode.Symbol, Indent: int(n.TaskListNode.Indent), Complete: n.TaskListNode.Complete, Children: children}
 	case *apiv2pb.Node_MathBlockNode:
 		return &ast.MathBlock{Content: n.MathBlockNode.Content}
 	case *apiv2pb.Node_TextNode:

plugin/gomark/ast/block.go

 package ast
 
-import "fmt"
+import (
+	"fmt"
+	"strings"
+)
 
 type BaseBlock struct {
 	BaseNode
@@ -110,7 +113,10 @@ func (n *Blockquote) Restore() string {
 type OrderedList struct {
 	BaseBlock
 
-	Number   string
+	// Number is the number of the list.
+	Number string
+	// Indent is the number of spaces.
+	Indent   int
 	Children []Node
 }
 
@@ -123,14 +129,16 @@ func (n *OrderedList) Restore() string {
 	for _, child := range n.Children {
 		result += child.Restore()
 	}
-	return fmt.Sprintf("%s. %s", n.Number, result)
+	return fmt.Sprintf("%s%s. %s", strings.Repeat(" ", n.Indent), n.Number, result)
 }
 
 type UnorderedList struct {
 	BaseBlock
 
 	// Symbol is "*" or "-" or "+".
-	Symbol   string
+	Symbol string
+	// Indent is the number of spaces.
+	Indent   int
 	Children []Node
 }
 
@@ -143,14 +151,16 @@ func (n *UnorderedList) Restore() string {
 	for _, child := range n.Children {
 		result += child.Restore()
 	}
-	return fmt.Sprintf("%s %s", n.Symbol, result)
+	return fmt.Sprintf("%s%s %s", strings.Repeat(" ", n.Indent), n.Symbol, result)
 }
 
 type TaskList struct {
 	BaseBlock
 
 	// Symbol is "*" or "-" or "+".
-	Symbol   string
+	Symbol string
+	// Indent is the number of spaces.
+	Indent   int
 	Complete bool
 	Children []Node
 }
@@ -168,7 +178,7 @@ func (n *TaskList) Restore() string {
 	if n.Complete {
 		complete = "x"
 	}
-	return fmt.Sprintf("%s [%s] %s", n.Symbol, complete, result)
+	return fmt.Sprintf("%s%s [%s] %s", strings.Repeat(" ", n.Indent), n.Symbol, complete, result)
 }
 
 type MathBlock struct {

plugin/gomark/parser/ordered_list.go

@@ -17,12 +17,22 @@ func (*OrderedListParser) Match(tokens []*tokenizer.Token) (int, bool) {
 	if len(tokens) < 4 {
 		return 0, false
 	}
-	if tokens[0].Type != tokenizer.Number || tokens[1].Type != tokenizer.Dot || tokens[2].Type != tokenizer.Space {
+
+	indent := 0
+	for _, token := range tokens {
+		if token.Type == tokenizer.Space {
+			indent++
+		} else {
+			break
+		}
+	}
+	corsor := indent
+	if tokens[corsor].Type != tokenizer.Number || tokens[corsor+1].Type != tokenizer.Dot || tokens[corsor+2].Type != tokenizer.Space {
 		return 0, false
 	}
 
 	contentTokens := []*tokenizer.Token{}
-	for _, token := range tokens[3:] {
+	for _, token := range tokens[corsor+3:] {
 		if token.Type == tokenizer.Newline {
 			break
 		}
@@ -33,7 +43,7 @@ func (*OrderedListParser) Match(tokens []*tokenizer.Token) (int, bool) {
 		return 0, false
 	}
 
-	return len(contentTokens) + 3, true
+	return indent + len(contentTokens) + 3, true
 }
 
 func (p *OrderedListParser) Parse(tokens []*tokenizer.Token) (ast.Node, error) {
@@ -42,13 +52,22 @@ func (p *OrderedListParser) Parse(tokens []*tokenizer.Token) (ast.Node, error) {
 		return nil, errors.New("not matched")
 	}
 
-	contentTokens := tokens[3:size]
+	indent := 0
+	for _, token := range tokens {
+		if token.Type == tokenizer.Space {
+			indent++
+		} else {
+			break
+		}
+	}
+	contentTokens := tokens[indent+3 : size]
 	children, err := ParseInline(contentTokens)
 	if err != nil {
 		return nil, err
 	}
 	return &ast.OrderedList{
-		Number:   tokens[0].Value,
+		Number:   tokens[indent].Value,
+		Indent:   indent,
 		Children: children,
 	}, nil
 }

plugin/gomark/parser/ordered_list_test.go

@@ -30,6 +30,18 @@ func TestOrderedListParser(t *testing.T) {
 				},
 			},
 		},
+		{
+			text: "  1. Hello World",
+			node: &ast.OrderedList{
+				Number: "1",
+				Indent: 2,
+				Children: []ast.Node{
+					&ast.Text{
+						Content: "Hello World",
+					},
+				},
+			},
+		},
 		{
 			text: "1aa. Hello World",
 			node: nil,

plugin/gomark/parser/paragraph.go

@@ -26,9 +26,6 @@ func (*ParagraphParser) Match(tokens []*tokenizer.Token) (int, bool) {
 	if len(contentTokens) == 0 {
 		return 0, false
 	}
-	if len(contentTokens) == 1 && contentTokens[0].Type == tokenizer.Newline {
-		return 0, false
-	}
 	return len(contentTokens), true
 }
 

plugin/gomark/parser/task_list.go

@@ -18,22 +18,30 @@ func (*TaskListParser) Match(tokens []*tokenizer.Token) (int, bool) {
 		return 0, false
 	}
 
-	symbolToken := tokens[0]
+	indent := 0
+	for _, token := range tokens {
+		if token.Type == tokenizer.Space {
+			indent++
+		} else {
+			break
+		}
+	}
+	symbolToken := tokens[indent]
 	if symbolToken.Type != tokenizer.Hyphen && symbolToken.Type != tokenizer.Asterisk && symbolToken.Type != tokenizer.PlusSign {
 		return 0, false
 	}
-	if tokens[1].Type != tokenizer.Space {
+	if tokens[indent+1].Type != tokenizer.Space {
 		return 0, false
 	}
-	if tokens[2].Type != tokenizer.LeftSquareBracket || (tokens[3].Type != tokenizer.Space && tokens[3].Value != "x") || tokens[4].Type != tokenizer.RightSquareBracket {
+	if tokens[indent+2].Type != tokenizer.LeftSquareBracket || (tokens[indent+3].Type != tokenizer.Space && tokens[indent+3].Value != "x") || tokens[indent+4].Type != tokenizer.RightSquareBracket {
 		return 0, false
 	}
-	if tokens[5].Type != tokenizer.Space {
+	if tokens[indent+5].Type != tokenizer.Space {
 		return 0, false
 	}
 
 	contentTokens := []*tokenizer.Token{}
-	for _, token := range tokens[6:] {
+	for _, token := range tokens[indent+6:] {
 		if token.Type == tokenizer.Newline {
 			break
 		}
@@ -43,7 +51,7 @@ func (*TaskListParser) Match(tokens []*tokenizer.Token) (int, bool) {
 		return 0, false
 	}
 
-	return len(contentTokens) + 6, true
+	return indent + len(contentTokens) + 6, true
 }
 
 func (p *TaskListParser) Parse(tokens []*tokenizer.Token) (ast.Node, error) {
@@ -52,15 +60,24 @@ func (p *TaskListParser) Parse(tokens []*tokenizer.Token) (ast.Node, error) {
 		return nil, errors.New("not matched")
 	}
 
-	symbolToken := tokens[0]
-	contentTokens := tokens[6:size]
+	indent := 0
+	for _, token := range tokens {
+		if token.Type == tokenizer.Space {
+			indent++
+		} else {
+			break
+		}
+	}
+	symbolToken := tokens[indent]
+	contentTokens := tokens[indent+6 : size]
 	children, err := ParseInline(contentTokens)
 	if err != nil {
 		return nil, err
 	}
 	return &ast.TaskList{
 		Symbol:   symbolToken.Type,
-		Complete: tokens[3].Value == "x",
+		Indent:   indent,
+		Complete: tokens[indent+3].Value == "x",
 		Children: children,
 	}, nil
 }

plugin/gomark/parser/task_list_test.go

@@ -31,6 +31,19 @@ func TestTaskListParser(t *testing.T) {
 				},
 			},
 		},
+		{
+			text: "  + [ ] Hello World",
+			node: &ast.TaskList{
+				Symbol:   tokenizer.PlusSign,
+				Indent:   2,
+				Complete: false,
+				Children: []ast.Node{
+					&ast.Text{
+						Content: "Hello World",
+					},
+				},
+			},
+		},
 		{
 			text: "* [x] **Hello**",
 			node: &ast.TaskList{

plugin/gomark/parser/unordered_list.go

@@ -17,13 +17,23 @@ func (*UnorderedListParser) Match(tokens []*tokenizer.Token) (int, bool) {
 	if len(tokens) < 3 {
 		return 0, false
 	}
-	symbolToken := tokens[0]
-	if (symbolToken.Type != tokenizer.Hyphen && symbolToken.Type != tokenizer.Asterisk && symbolToken.Type != tokenizer.PlusSign) || tokens[1].Type != tokenizer.Space {
+
+	indent := 0
+	for _, token := range tokens {
+		if token.Type == tokenizer.Space {
+			indent++
+		} else {
+			break
+		}
+	}
+	corsor := indent
+	symbolToken := tokens[corsor]
+	if (symbolToken.Type != tokenizer.Hyphen && symbolToken.Type != tokenizer.Asterisk && symbolToken.Type != tokenizer.PlusSign) || tokens[corsor+1].Type != tokenizer.Space {
 		return 0, false
 	}
 
 	contentTokens := []*tokenizer.Token{}
-	for _, token := range tokens[2:] {
+	for _, token := range tokens[corsor+2:] {
 		if token.Type == tokenizer.Newline {
 			break
 		}
@@ -33,7 +43,7 @@ func (*UnorderedListParser) Match(tokens []*tokenizer.Token) (int, bool) {
 		return 0, false
 	}
 
-	return len(contentTokens) + 2, true
+	return indent + len(contentTokens) + 2, true
 }
 
 func (p *UnorderedListParser) Parse(tokens []*tokenizer.Token) (ast.Node, error) {
@@ -42,14 +52,23 @@ func (p *UnorderedListParser) Parse(tokens []*tokenizer.Token) (ast.Node, error)
 		return nil, errors.New("not matched")
 	}
 
-	symbolToken := tokens[0]
-	contentTokens := tokens[2:size]
+	indent := 0
+	for _, token := range tokens {
+		if token.Type == tokenizer.Space {
+			indent++
+		} else {
+			break
+		}
+	}
+	symbolToken := tokens[indent]
+	contentTokens := tokens[indent+2 : size]
 	children, err := ParseInline(contentTokens)
 	if err != nil {
 		return nil, err
 	}
 	return &ast.UnorderedList{
 		Symbol:   symbolToken.Type,
+		Indent:   indent,
 		Children: children,
 	}, nil
 }

proto/api/v2/markdown_service.proto

@@ -103,18 +103,21 @@ message BlockquoteNode {
 
 message OrderedListNode {
   string number = 1;
-  repeated Node children = 2;
+  int32 indent = 2;
+  repeated Node children = 3;
 }
 
 message UnorderedListNode {
   string symbol = 1;
-  repeated Node children = 2;
+  int32 indent = 2;
+  repeated Node children = 3;
 }
 
 message TaskListNode {
   string symbol = 1;
-  bool complete = 2;
-  repeated Node children = 3;
+  int32 indent = 2;
+  bool complete = 3;
+  repeated Node children = 4;
 }
 
 message MathBlockNode {

proto/gen/api/v2/README.md

@@ -1233,6 +1233,7 @@
 | Field | Type | Label | Description |
 | ----- | ---- | ----- | ----------- |
 | number | [string](#string) |  |  |
+| indent | [int32](#int32) |  |  |
 | children | [Node](#memos-api-v2-Node) | repeated |  |
 
 
@@ -1324,6 +1325,7 @@
 | Field | Type | Label | Description |
 | ----- | ---- | ----- | ----------- |
 | symbol | [string](#string) |  |  |
+| indent | [int32](#int32) |  |  |
 | complete | [bool](#bool) |  |  |
 | children | [Node](#memos-api-v2-Node) | repeated |  |
 
@@ -1356,6 +1358,7 @@
 | Field | Type | Label | Description |
 | ----- | ---- | ----- | ----------- |
 | symbol | [string](#string) |  |  |
+| indent | [int32](#int32) |  |  |
 | children | [Node](#memos-api-v2-Node) | repeated |  |
 
 

web/src/components/MemoContent/OrderedList.tsx

+import { repeat } from "lodash-es";
 import { Node } from "@/types/proto/api/v2/markdown_service";
 import Renderer from "./Renderer";
 import { BaseProps } from "./types";
 
 interface Props extends BaseProps {
   number: string;
+  indent: number;
   children: Node[];
 }
 
-const OrderedList: React.FC<Props> = ({ number, children }: Props) => {
+const OrderedList: React.FC<Props> = ({ number, indent, children }: Props) => {
   return (
     <ol>
-      <li className="grid grid-cols-[24px_1fr] gap-1">
-        <div className="w-7 h-6 flex justify-center items-center">
-          <span className="opacity-80">{number}.</span>
+      <li className="w-full flex flex-row">
+        <div className="block font-mono shrink-0">
+          <span>{repeat(" ", indent)}</span>
         </div>
-        <div>
-          {children.map((child, index) => (
-            <Renderer key={`${child.type}-${index}`} index={String(index)} node={child} />
-          ))}
+        <div className="w-auto grid grid-cols-[24px_1fr] gap-1">
+          <div className="w-7 h-6 flex justify-center items-center">
+            <span className="opacity-80">{number}.</span>
+          </div>
+          <div>
+            {children.map((child, index) => (
+              <Renderer key={`${child.type}-${index}`} index={String(index)} node={child} />
+            ))}
+          </div>
         </div>
       </li>
     </ol>

web/src/components/MemoContent/TaskList.tsx

 import { Checkbox } from "@mui/joy";
+import classNames from "classnames";
+import { repeat } from "lodash-es";
 import { useContext } from "react";
 import { useMemoStore } from "@/store/v1";
 import { Node, NodeType } from "@/types/proto/api/v2/markdown_service";
@@ -8,11 +10,12 @@ import { RendererContext } from "./types";
 interface Props {
   index: string;
   symbol: string;
+  indent: number;
   complete: boolean;
   children: Node[];
 }
 
-const TaskList: React.FC<Props> = ({ index, complete, children }: Props) => {
+const TaskList: React.FC<Props> = ({ index, indent, complete, children }: Props) => {
   const context = useContext(RendererContext);
   const memoStore = useMemoStore();
 
@@ -43,14 +46,19 @@ const TaskList: React.FC<Props> = ({ index, complete, children }: Props) => {
 
   return (
     <ul>
-      <li className="grid grid-cols-[24px_1fr] gap-1">
-        <div className="w-7 h-6 flex justify-center items-center">
-          <Checkbox size="sm" checked={complete} disabled={context.readonly} onChange={(e) => handleCheckboxChange(e.target.checked)} />
+      <li className="w-full flex flex-row">
+        <div className="block font-mono shrink-0">
+          <span>{repeat(" ", indent)}</span>
         </div>
-        <div>
-          {children.map((child, subIndex) => (
-            <Renderer key={`${child.type}-${subIndex}`} index={`${index}-${subIndex}`} node={child} />
-          ))}
+        <div className="w-auto grid grid-cols-[24px_1fr] gap-1">
+          <div className="w-7 h-6 flex justify-center items-center">
+            <Checkbox size="sm" checked={complete} disabled={context.readonly} onChange={(e) => handleCheckboxChange(e.target.checked)} />
+          </div>
+          <div className={classNames(complete && "line-through opacity-80")}>
+            {children.map((child, index) => (
+              <Renderer key={`${child.type}-${index}`} index={String(index)} node={child} />
+            ))}
+          </div>
         </div>
       </li>
     </ul>

web/src/components/MemoContent/UnorderedList.tsx

+import { repeat } from "lodash-es";
 import { Node } from "@/types/proto/api/v2/markdown_service";
 import Renderer from "./Renderer";
 
 interface Props {
   symbol: string;
+  indent: number;
   children: Node[];
 }
 
-const UnorderedList: React.FC<Props> = ({ children }: Props) => {
+const UnorderedList: React.FC<Props> = ({ indent, children }: Props) => {
   return (
     <ul>
-      <li className="grid grid-cols-[24px_1fr] gap-1">
-        <div className="w-7 h-6 flex justify-center items-center">
-          <span className="opacity-80">•</span>
+      <li className="w-full flex flex-row">
+        <div className="block font-mono shrink-0">
+          <span>{repeat(" ", indent)}</span>
         </div>
-        <div>
-          {children.map((child, index) => (
-            <Renderer key={`${child.type}-${index}`} index={String(index)} node={child} />
-          ))}
+        <div className="w-auto grid grid-cols-[24px_1fr] gap-1">
+          <div className="w-7 h-6 flex justify-center items-center">
+            <span className="opacity-80">•</span>
+          </div>
+          <div>
+            {children.map((child, index) => (
+              <Renderer key={`${child.type}-${index}`} index={String(index)} node={child} />
+            ))}
+          </div>
         </div>
       </li>
     </ul>