diff --git a/src/MarkdownTextInput.web.tsx b/src/MarkdownTextInput.web.tsx
index 230b11cd..d6edf7d8 100644
--- a/src/MarkdownTextInput.web.tsx
+++ b/src/MarkdownTextInput.web.tsx
@@ -81,7 +81,7 @@ let focusTimeout: NodeJS.Timeout | null = null;
type MarkdownTextInputElement = HTMLDivElement &
HTMLInputElement & {
- tree: TreeUtilsTypes.TreeItem;
+ tree: TreeUtilsTypes.TreeNode;
};
// If an Input Method Editor is processing key input, the 'keyCode' is 229.
diff --git a/src/web/parserUtils.ts b/src/web/parserUtils.ts
index c2f7fd56..be7b4153 100644
--- a/src/web/parserUtils.ts
+++ b/src/web/parserUtils.ts
@@ -5,7 +5,7 @@ import * as TreeUtils from './treeUtils';
import type * as TreeUtilsTypes from './treeUtils';
type PartialMarkdownStyle = StyleUtilsTypes.PartialMarkdownStyle;
-type TreeItem = TreeUtilsTypes.TreeItem;
+type TreeNode = TreeUtilsTypes.TreeNode;
type MarkdownType = 'bold' | 'italic' | 'strikethrough' | 'emoji' | 'link' | 'code' | 'pre' | 'blockquote' | 'h1' | 'syntax' | 'mention-here' | 'mention-user' | 'mention-report';
@@ -334,7 +334,7 @@ function parseText(target: HTMLElement, text: string, cursorPositionIndex: numbe
}
const ranges = global.parseExpensiMarkToRanges(text);
const markdownRanges: MarkdownRange[] = ranges as MarkdownRange[];
- let tree: TreeItem | null = null;
+ let tree: TreeNode | null = null;
if (!text || targetElement.innerHTML === '
' || (targetElement && targetElement.innerHTML === '\n')) {
targetElement.innerHTML = '';
diff --git a/src/web/treeUtils.ts b/src/web/treeUtils.ts
index f0315be7..9a9e4e20 100644
--- a/src/web/treeUtils.ts
+++ b/src/web/treeUtils.ts
@@ -6,43 +6,41 @@ type MarkdownRange = ParserUtilsTypes.MarkdownRange;
type ElementType = MarkdownType | 'line' | 'text' | 'br';
-type TreeItem = Omit & {
+type TreeNode = Omit & {
element: HTMLElement;
- parent: TreeItem | null;
- children: TreeItem[];
- relativeStart: number;
+ parentNode: TreeNode | null;
+ childNodes: TreeNode[];
type: ElementType;
orderIndex: string;
isGeneratingNewline: boolean;
};
-function addItemToTree(element: HTMLElement, parentTreeItem: TreeItem, type: ElementType) {
+function addItemToTree(element: HTMLElement, parentTreeNode: TreeNode, type: ElementType) {
const contentLength = element.nodeName === 'BR' ? 1 : element.innerText.length;
const isGeneratingNewline = type === 'line' && !(element.childNodes.length === 1 && element.childNodes[0]?.getAttribute('data-type') === 'br');
- const parentChildrenCount = parentTreeItem?.children.length || 0;
- let startIndex = parentTreeItem.start;
+ const parentChildrenCount = parentTreeNode?.childNodes.length || 0;
+ let startIndex = parentTreeNode.start;
if (parentChildrenCount > 0) {
- const lastParentChild = parentTreeItem.children[parentChildrenCount - 1];
+ const lastParentChild = parentTreeNode.childNodes[parentChildrenCount - 1];
if (lastParentChild) {
startIndex = lastParentChild.start + lastParentChild.length;
startIndex += lastParentChild.isGeneratingNewline ? 1 : 0;
}
}
- const item: TreeItem = {
+ const item: TreeNode = {
element,
- parent: parentTreeItem,
- children: [],
- relativeStart: startIndex - (parentTreeItem?.start || 0),
+ parentNode: parentTreeNode,
+ childNodes: [],
start: startIndex,
length: contentLength,
type,
- orderIndex: parentTreeItem.parent === null ? `${parentChildrenCount}` : `${parentTreeItem.orderIndex},${parentChildrenCount}`,
+ orderIndex: parentTreeNode.parentNode === null ? `${parentChildrenCount}` : `${parentTreeNode.orderIndex},${parentChildrenCount}`,
isGeneratingNewline,
};
element.setAttribute('data-id', item.orderIndex);
- parentTreeItem.children.push(item);
+ parentTreeNode.childNodes.push(item);
return item;
}
@@ -57,11 +55,10 @@ function buildTree(rootElement: HTMLElement, text: string) {
return (element.getAttribute('data-type') as ElementType) || 'text';
}
- const rootTreeItem: TreeItem = {
+ const rootTreeItem: TreeNode = {
element: rootElement,
- parent: null,
- children: [],
- relativeStart: 0,
+ parentNode: null,
+ childNodes: [],
start: 0,
length: text.replace(/\n/g, '\\n').length,
type: 'text',
@@ -84,7 +81,7 @@ function buildTree(rootElement: HTMLElement, text: string) {
return rootTreeItem;
}
-function findElementInTree(treeRoot: TreeItem, element: HTMLElement) {
+function findElementInTree(treeRoot: TreeNode, element: HTMLElement) {
if (element.hasAttribute('contenteditable')) {
return treeRoot;
}
@@ -93,7 +90,7 @@ function findElementInTree(treeRoot: TreeItem, element: HTMLElement) {
return;
}
const indexes = element.getAttribute('data-id')?.split(',');
- let el: TreeItem | null = treeRoot;
+ let el: TreeNode | null = treeRoot;
while (el && indexes && indexes.length > 0) {
const index = Number(indexes.shift() || -1);
@@ -102,38 +99,38 @@ function findElementInTree(treeRoot: TreeItem, element: HTMLElement) {
}
if (el) {
- el = el.children[index] || null;
+ el = el.childNodes[index] || null;
}
}
return el;
}
-function getElementByIndex(treeRoot: TreeItem, index: number) {
- let el: TreeItem | null = treeRoot;
+function getElementByIndex(treeRoot: TreeNode, index: number) {
+ let el: TreeNode | null = treeRoot;
let i = 0;
let newLineGenerated = false;
- while (el && el.children.length > 0 && i < el.children.length) {
- const child = el.children[i] as TreeItem;
+ while (el && el.childNodes.length > 0 && i < el.childNodes.length) {
+ const child = el.childNodes[i] as TreeNode;
if (!child) {
break;
}
if (index >= child.start && index < child.start + child.length) {
- if (child.children.length === 0) {
+ if (child.childNodes.length === 0) {
return child;
}
el = child;
i = 0;
} else if ((child.isGeneratingNewline || newLineGenerated) && index === child.start + child.length) {
newLineGenerated = true;
- if (child.children.length === 0) {
+ if (child.childNodes.length === 0) {
return child;
}
el = child;
- i = el.children.length - 1;
+ i = el.childNodes.length - 1;
} else {
i++;
}
@@ -143,4 +140,4 @@ function getElementByIndex(treeRoot: TreeItem, index: number) {
export {addItemToTree, findElementInTree, getElementByIndex, buildTree};
-export type {TreeItem};
+export type {TreeNode};