From fc0fdb2fe36966e3b8a51107d9929ca137e5681c Mon Sep 17 00:00:00 2001
From: Douglas Meirelles <douglasmatheusmeirelles@gmail.com>
Date: Fri, 15 Sep 2023 12:10:11 -0300
Subject: [PATCH] improve: adjusted the tab draw in the list style #283

Co-authored-by: Hufe921 <huangyunfeihufe@hotmail.com>
---
 src/editor/core/draw/particle/ListParticle.ts | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/editor/core/draw/particle/ListParticle.ts b/src/editor/core/draw/particle/ListParticle.ts
index 8c19a87..3d4c8eb 100644
--- a/src/editor/core/draw/particle/ListParticle.ts
+++ b/src/editor/core/draw/particle/ListParticle.ts
@@ -1,5 +1,6 @@
 import { ZERO } from '../../../dataset/constant/Common'
 import { ulStyleMapping } from '../../../dataset/constant/List'
+import { ElementType } from '../../../dataset/enum/Element'
 import { KeyMap } from '../../../dataset/enum/KeyMap'
 import { ListStyle, ListType, UlStyle } from '../../../dataset/enum/List'
 import { DeepRequired } from '../../../interface/Common'
@@ -90,6 +91,14 @@ export class ListParticle {
     const { elementList, offsetX, listIndex, ascent } = row
     const startElement = elementList[0]
     if (startElement.value !== ZERO || startElement.listWrap) return
+    // tab width
+    let tabWidth = 0
+    const { defaultTabWidth, scale, defaultFont, defaultSize } = this.options
+    for (let i = 1; i < elementList.length; i++) {
+      const element = elementList[i]
+      if (element?.type !== ElementType.TAB) break
+      tabWidth += defaultTabWidth * scale
+    }
     let text = ''
     if (startElement.listType === ListType.UL) {
       text =
@@ -104,9 +113,8 @@ export class ListParticle {
         leftTop: [startX, startY]
       }
     } = position
-    const x = startX - offsetX!
+    const x = startX - offsetX! + tabWidth
     const y = startY + ascent
-    const { defaultFont, defaultSize, scale } = this.options
     ctx.save()
     ctx.font = `${defaultSize * scale}px ${defaultFont}`
     ctx.fillText(text, x, y)