devexpress-richedit 24.1.1-alpha-24085-0102 → 24.1.3

package/lib/common/{html-export.js → formats/html/export/html-export.js}

@@ -1,162 +1,52 @@
-import { RichEditUnit } from './utils/unit-converter';
-import { LayoutPictureBox } from './layout/main-structures/layout-boxes/layout-picture-box';
-import { BorderLineStyle } from './model/borders/enums';
-import { CharacterProperties } from './model/character/character-properties';
-import { CharacterFormattingScript, UnderlineType } from './model/character/enums';
-import { ColorHelper } from './model/color/color';
-import { Field } from './model/fields/field';
-import { NumberingFormat } from './model/numbering-lists/list-level-properties';
-import { NumberingType } from './model/numbering-lists/numbering-list';
-import { ParagraphAlignment, ParagraphFirstLineIndent, ParagraphLineSpacingType } from './model/paragraph/paragraph-properties';
-import { RichUtils } from './model/rich-utils';
-import { RunType } from './model/runs/run-type';
-import { Table } from './model/tables/main-structures/table';
-import { TableCellPropertiesMergerShadingInfo, TableCellVerticalAlignmentMerger } from './model/tables/properties-mergers/table-cell-properties-merger';
-import { TablePropertiesMergerBorderHorizontal, TablePropertiesMergerBorderVertical, TablePropertiesMergerCellSpacing, TablePropertiesMergerIndent } from './model/tables/properties-mergers/table-properties-merger';
-import { ConditionalTableStyleFormatting, TableCellMergingState, TableCellVerticalAlignment } from './model/tables/secondary-structures/table-base-structures';
-import { TableWidthUnitType } from './model/tables/secondary-structures/table-units';
-import { HtmlConverter } from './rich-utils/html-converter';
 import { UnitConverter } from '@devexpress/utils/lib/class/unit-converter';
 import { FixedInterval } from '@devexpress/utils/lib/intervals/fixed';
 import { ColorUtils } from '@devexpress/utils/lib/utils/color';
 import { EncodeUtils } from '@devexpress/utils/lib/utils/encode';
 import { SearchUtils } from '@devexpress/utils/lib/utils/search';
 import { StringUtils } from '@devexpress/utils/lib/utils/string';
-export class HtmlBuilder {
-    constructor() {
-        this.childElements = [];
-        this.callbacks = [];
-    }
-    _getHtmlString() {
-        return this.childElements.map(x => {
-            if (typeof x === 'string')
-                return x;
-            return x.outerHTML;
-        }).join('');
-    }
-    isEmpty() {
-        return this.callbacks.length === 0 && this.childElements.length === 0;
-    }
-    clear() {
-        this._currentElement = null;
-        this.callbacks = [];
-        this.childElements = [];
-        return this;
-    }
-    startChild(tagName, namespaceUri) {
-        const element = (namespaceUri) ? document.createElementNS(namespaceUri, tagName) : document.createElement(tagName);
-        if (this._currentElement)
-            this._currentElement.appendChild(element);
-        else {
-            this.childElements.push(element);
-        }
-        this._currentElement = element;
-        return this;
-    }
-    configure(config) {
-        config(this._currentElement);
-        return this;
-    }
-    addCallback(callback) {
-        this.callbacks.push(callback);
-    }
-    assignFrom(builder) {
-        if (!builder)
-            return this;
-        if (typeof builder === "string") {
-            this.addElement(builder);
-            return this;
-        }
-        builder.callbacks.forEach((callback) => {
-            callback(this);
-        });
-        builder.childElements.forEach((el) => {
-            this.addElement(el);
-        });
-        builder.clear();
-        return this;
-    }
-    addElement(element) {
-        if (!element)
-            return this;
-        if (!this._currentElement) {
-            this.childElements.push(element);
-            return this;
-        }
-        if (typeof element === 'string')
-            this._currentElement.innerHTML += element;
-        else if (this._currentElement)
-            this._currentElement.appendChild(element);
-        else
-            this._currentElement = element;
-        return this;
-    }
-    endChild(tagName) {
-        let currentElement = this._currentElement;
-        while (currentElement.tagName.toLowerCase() !== tagName.toLowerCase()) {
-            currentElement = currentElement.parentElement;
-        }
-        this._currentElement = currentElement.parentElement;
-        return this;
-    }
-}
+import { RichEditUnit } from '../../../utils/unit-converter';
+import { LayoutPictureBox } from '../../../layout/main-structures/layout-boxes/layout-picture-box';
+import { BorderLineStyle } from '../../../model/borders/enums';
+import { CharacterProperties } from '../../../model/character/character-properties';
+import { CharacterFormattingScript, UnderlineType } from '../../../model/character/enums';
+import { ColorHelper } from '../../../model/color/color';
+import { Field } from '../../../model/fields/field';
+import { NumberingFormat } from '../../../model/numbering-lists/list-level-properties';
+import { NumberingType } from '../../../model/numbering-lists/numbering-list';
+import { ParagraphAlignment, ParagraphFirstLineIndent, ParagraphLineSpacingType, } from '../../../model/paragraph/paragraph-properties';
+import { RichUtils } from '../../../model/rich-utils';
+import { RunType } from '../../../model/runs/run-type';
+import { Table } from '../../../model/tables/main-structures/table';
+import { TableCellPropertiesMergerShadingInfo, TableCellVerticalAlignmentMerger, } from '../../../model/tables/properties-mergers/table-cell-properties-merger';
+import { TablePropertiesMergerBorderHorizontal, TablePropertiesMergerBorderVertical, TablePropertiesMergerCellSpacing, TablePropertiesMergerIndent, } from '../../../model/tables/properties-mergers/table-properties-merger';
+import { ConditionalTableStyleFormatting, TableCellMergingState, TableCellVerticalAlignment, } from '../../../model/tables/secondary-structures/table-base-structures';
+import { TableWidthUnitType } from '../../../model/tables/secondary-structures/table-units';
+import { HtmlConverter } from '../../../rich-utils/html-converter';
+import { HtmlBuilder } from './html-builder';
+import { isDefined } from '@devexpress/utils/lib/utils/common';
 export class HtmlExporter {
-    constructor(control) {
+    constructor(exportModelOptions) {
         this.rangeCopy = null;
-        this.control = control;
+        this.exportModelOptions = exportModelOptions;
     }
-    get colorProvider() { return this.control.modelManager.model.colorProvider; }
+    get modelManager() { return this.exportModelOptions.modelManager; }
+    get colorProvider() { return this.modelManager.model.colorProvider; }
+    get unitConverter() { return this.exportModelOptions.uiUnitConverter; }
+    get documentRenderer() { return this.exportModelOptions.pictureRenderer; }
+    get lastMaxNumPages() { return this.exportModelOptions.lastMaxNumPages; }
+    ;
+    get pageIndex() { return this.exportModelOptions.pageIndex; }
+    ;
     getHtmlElementsByInterval(model, subDocument, interval, guidLabel) {
         if (interval.length === 0)
             return;
-        const unitConverter = this.control.uiUnitConverter;
-        const unitTypeToString = unitConverter.getUnits() == RichEditUnit.Centimeter ? "cm" : "in";
+        const unitTypeToString = this.unitConverter.getUnits() == RichEditUnit.Centimeter ? "cm" : "in";
         const iterator = subDocument.getConstRunIterator(interval);
         let remainLength = interval.length;
         let currentPosition = interval.start;
-        const renderer = this.control.viewManager.renderer;
         let resultBuilder = new HtmlBuilder();
-        const paragraphsInInterval = subDocument.getParagraphsByInterval(interval);
-        const paragraphs = [];
-        for (let i = 0, paragraphInInterval; paragraphInInterval = paragraphsInInterval[i]; i++) {
-            if (interval.containsWithIntervalEnd(paragraphInInterval.getEndPosition()))
-                paragraphs.push(paragraphInInterval);
-        }
-        const listsInInterval = [];
-        for (let i = 0, paragraph; paragraph = paragraphs[i]; i++) {
-            if (paragraph.isInList()) {
-                const paragraphNumberingListIndex = paragraph.getNumberingListIndex();
-                const paragraphListLevelIndex = paragraph.getListLevelIndex();
-                const paragraphStart = paragraph.startLogPosition.value;
-                const paragraphEnd = paragraph.getEndPosition();
-                let existingItem = null;
-                for (let j = 0; j < listsInInterval.length; j++) {
-                    if (listsInInterval[j].numberingListIndex == paragraphNumberingListIndex && listsInInterval[j].listLevelIndex == paragraphListLevelIndex)
-                        existingItem = listsInInterval[j];
-                }
-                if (existingItem && (paragraphListLevelIndex == 0 || existingItem.end == paragraphStart
-                    || listsInInterval[listsInInterval.length - 1].listLevelIndex > paragraphListLevelIndex)) {
-                    existingItem.end = paragraphEnd;
-                }
-                else {
-                    listsInInterval.push({
-                        numberingListIndex: paragraphNumberingListIndex, listLevelIndex: paragraphListLevelIndex,
-                        start: paragraphStart, end: paragraphEnd
-                    });
-                }
-                let listLevelIndex = paragraphListLevelIndex;
-                while (listLevelIndex > 0) {
-                    let parentItem = null;
-                    for (let j = 0; j < listsInInterval.length; j++) {
-                        if (listsInInterval[j].listLevelIndex == listLevelIndex - 1)
-                            parentItem = listsInInterval[j];
-                    }
-                    if (parentItem)
-                        parentItem.end = paragraphEnd;
-                    listLevelIndex--;
-                }
-            }
-        }
+        const paragraphs = this.getParagraphsByInterval(subDocument, interval);
+        const lists = this.getListsByParagraphs(paragraphs);
         let isInsideFieldCode = false;
         let fieldDeep = 0;
         let isInsideHyperlink = false;
@@ -166,53 +56,6 @@ export class HtmlExporter {
         while (iterator.moveNext()) {
             const tableCell = Table.getTableCellByPosition(subDocument.tables, iterator.currentInterval().start);
             const isContinueMergingCell = tableCell && tableCell.verticalMerging === TableCellMergingState.Continue;
-            let listToStartIndex = -1;
-            const listsToEndIndices = [];
-            if (!tableCell) {
-                if (listsInInterval.length) {
-                    const currentPosition = iterator.currentInterval().start;
-                    for (let i = 0; i < listsInInterval.length; i++) {
-                        if (listsInInterval[i].start == currentPosition)
-                            listToStartIndex = i;
-                        if (listsInInterval[i].end == iterator.currentInterval().end)
-                            listsToEndIndices.push(i);
-                    }
-                    if (listToStartIndex < 0 && currentPosition == interval.start) {
-                        const firstParagraph = subDocument.getParagraphByPosition(currentPosition);
-                        if (firstParagraph.getNumberingListIndex() == listsInInterval[0].numberingListIndex)
-                            listToStartIndex = 0;
-                    }
-                }
-                if (listToStartIndex > -1) {
-                    const numberingList = model.numberingLists[listsInInterval[listToStartIndex].numberingListIndex];
-                    let listFormatType = "";
-                    switch (numberingList.levels[listsInInterval[listToStartIndex].listLevelIndex].getListLevelProperties().format) {
-                        case NumberingFormat.Bullet:
-                            listFormatType = "disc";
-                            break;
-                        case NumberingFormat.Decimal:
-                            listFormatType = "decimal";
-                            break;
-                        case NumberingFormat.LowerLetter:
-                            listFormatType = "lower-alpha";
-                            break;
-                        case NumberingFormat.UpperLetter:
-                            listFormatType = "upper-alpha";
-                            break;
-                        case NumberingFormat.LowerRoman:
-                            listFormatType = "lower-roman";
-                            break;
-                        case NumberingFormat.UpperRoman:
-                            listFormatType = "upper-roman";
-                            break;
-                        default:
-                            break;
-                    }
-                    resultBuilder
-                        .startChild(numberingList.getListType() != NumberingType.Bullet ? "ol" : "ul")
-                        .configure((e) => e.style.cssText = "list-style-type:" + listFormatType);
-                }
-            }
             const run = iterator.currentRun;
             const isRunInEmptyParagraph = run.paragraph.length === 1;
             if (paragraphs.length && (run.getType() != RunType.ParagraphRun || isRunInEmptyParagraph)) {
@@ -221,60 +64,27 @@ export class HtmlExporter {
                     const currentParagraph = paragraphs[paragraphToStartIndex];
                     paragraphs.splice(paragraphToStartIndex, 1);
                     if (tableCell) {
-                        let parentRow = tableCell.parentRow;
-                        let parentTable = parentRow.parentTable;
-                        let paragraphStartPosition = currentParagraph.startLogPosition.value;
-                        if (parentTable.getStartPosition() == paragraphStartPosition) {
-                            if (parentTable.parentCell) {
-                                let parentCell = parentTable.parentCell;
-                                while (parentCell) {
-                                    let currentParentRow = parentCell.parentRow;
-                                    let currentParentTable = currentParentRow.parentTable;
-                                    if (currentParentTable.getStartPosition() == paragraphStartPosition)
-                                        resultBuilder
-                                            .startChild('table')
-                                            .configure((e) => e.style.cssText = this.getTableStyle(model, currentParentTable))
-                                            .startChild('tbody');
-                                    if (currentParentRow.getStartPosition() == paragraphStartPosition) {
-                                        resultBuilder.startChild('tr');
-                                        if (currentParentRow.gridBefore > 0)
-                                            resultBuilder
-                                                .startChild('td')
-                                                .configure((el) => {
-                                                el.style.cssText = "mso-cell-special:placeholder";
-                                                el.setAttribute('colspan', currentParentRow.gridBefore.toString());
-                                                el.innerHTML = "&nbsp;";
-                                            })
-                                                .endChild('td');
-                                    }
-                                    if (parentCell.startParagraphPosition.value == paragraphStartPosition) {
-                                        resultBuilder
-                                            .startChild('td')
-                                            .configure((el) => {
-                                            el.style.cssText = this.getCellStyle(model, parentCell);
-                                            if (parentCell.columnSpan > 1) {
-                                                el.setAttribute('colspan', parentCell.columnSpan.toString());
-                                            }
-                                        });
-                                    }
-                                    parentCell = currentParentTable.parentCell;
-                                }
-                            }
+                        const row = tableCell.parentRow;
+                        const table = row.parentTable;
+                        const paragraphStartPosition = currentParagraph.startLogPosition.value;
+                        if (table.getStartPosition() == paragraphStartPosition) {
+                            if (table.parentCell)
+                                this.addParentTableRecursively(model, resultBuilder, table.parentCell, paragraphStartPosition);
                             resultBuilder
                                 .startChild('table')
                                 .configure((el) => {
-                                el.style.cssText = this.getTableStyle(model, parentTable);
+                                el.style.cssText = this.getTableStyle(model, table);
                             })
                                 .startChild('tbody');
                         }
-                        if (parentRow.getStartPosition() == paragraphStartPosition) {
+                        if (row.getStartPosition() == paragraphStartPosition) {
                             resultBuilder.startChild('tr');
-                            if (parentRow.gridBefore > 0) {
+                            if (row.gridBefore > 0) {
                                 resultBuilder
                                     .startChild('td')
                                     .configure((el) => {
                                     el.style.cssText = "mso-cell-special:placeholder";
-                                    el.setAttribute('colspan', parentRow.gridBefore.toString());
+                                    el.setAttribute('colspan', row.gridBefore.toString());
                                     el.innerHTML = "&nbsp;";
                                 })
                                     .endChild('td');
@@ -283,18 +93,18 @@ export class HtmlExporter {
                         if (tableCell.startParagraphPosition.value == paragraphStartPosition && !isContinueMergingCell) {
                             let rowSpan = 1;
                             if (tableCell.verticalMerging === TableCellMergingState.Restart) {
-                                let rowIndex = parentTable.rows.indexOf(parentRow);
-                                let cellIndex = parentRow.cells.indexOf(tableCell);
-                                for (let i = rowIndex + 1, row; row = parentTable.rows[i]; i++) {
+                                let rowIndex = table.rows.indexOf(row);
+                                let cellIndex = row.cells.indexOf(tableCell);
+                                for (let i = rowIndex + 1, row; row = table.rows[i]; i++) {
                                     let nextRowCellIndex = cellIndex;
-                                    if (row.cells.length != parentRow.cells.length) {
+                                    if (row.cells.length != row.cells.length) {
                                         let extraCellsCount = 0;
-                                        let isNextRowLonger = row.cells.length > parentRow.cells.length;
-                                        let shorterRow = isNextRowLonger ? parentRow : row;
+                                        let isNextRowLonger = row.cells.length > row.cells.length;
+                                        let shorterRow = isNextRowLonger ? row : row;
                                         for (let j = 0; (j < cellIndex) && (j < shorterRow.cells.length); j++) {
                                             extraCellsCount += shorterRow.cells[j].columnSpan - 1;
                                             if (!isNextRowLonger)
-                                                extraCellsCount -= parentRow.cells[j].columnSpan - 1;
+                                                extraCellsCount -= row.cells[j].columnSpan - 1;
                                         }
                                         nextRowCellIndex += (isNextRowLonger ? 1 : -1) * extraCellsCount;
                                     }
@@ -316,13 +126,14 @@ export class HtmlExporter {
                             });
                         }
                     }
+                    this.startList(model, subDocument, interval, resultBuilder, lists, iterator.currentInterval().start);
                     if (!isContinueMergingCell) {
                         const maskedParagraphProperties = currentParagraph.getParagraphMergedProperties();
                         let paragraphStyle = "";
                         const firstLineIndentType = maskedParagraphProperties.firstLineIndentType;
                         if (firstLineIndentType != ParagraphFirstLineIndent.None) {
                             paragraphStyle += "text-indent: " + (firstLineIndentType == ParagraphFirstLineIndent.Hanging ? "-" : "") +
-                                unitConverter.twipsToUI(maskedParagraphProperties.firstLineIndent) + unitTypeToString + ";";
+                                this.unitConverter.twipsToUI(maskedParagraphProperties.firstLineIndent) + unitTypeToString + ";";
                         }
                         if (maskedParagraphProperties.alignment !== undefined) {
                             paragraphStyle += "text-align: ";
@@ -349,7 +160,7 @@ export class HtmlExporter {
                             }
                         }
                         if (maskedParagraphProperties.lineSpacingType != ParagraphLineSpacingType.Single) {
-                            const lineSpacingInUI = unitConverter.twipsToUI(maskedParagraphProperties.lineSpacing) + unitTypeToString + ";";
+                            const lineSpacingInUI = this.unitConverter.twipsToUI(maskedParagraphProperties.lineSpacing) + unitTypeToString + ";";
                             paragraphStyle += "line-height: ";
                             switch (maskedParagraphProperties.lineSpacingType) {
                                 case ParagraphLineSpacingType.AtLeast:
@@ -374,11 +185,11 @@ export class HtmlExporter {
                         if (ColorUtils.getAlpha(maskedParagraphProperties.shadingInfo.getActualColor(this.colorProvider)) > 0)
                             paragraphStyle += "background: " + ColorHelper.getCssStringInternal(maskedParagraphProperties.shadingInfo.getActualColor(this.colorProvider)) + ";";
                         if (maskedParagraphProperties.leftIndent)
-                            paragraphStyle += "margin-left: " + unitConverter.twipsToUI(maskedParagraphProperties.leftIndent) + unitTypeToString + ";";
+                            paragraphStyle += "margin-left: " + this.unitConverter.twipsToUI(maskedParagraphProperties.leftIndent) + unitTypeToString + ";";
                         if (maskedParagraphProperties.rightIndent)
-                            paragraphStyle += "margin-right: " + unitConverter.twipsToUI(maskedParagraphProperties.rightIndent) + unitTypeToString + ";";
-                        paragraphStyle += "margin-top: " + unitConverter.twipsToUI(maskedParagraphProperties.spacingBefore) + unitTypeToString + ";";
-                        paragraphStyle += "margin-bottom: " + unitConverter.twipsToUI(maskedParagraphProperties.spacingAfter) + unitTypeToString + ";";
+                            paragraphStyle += "margin-right: " + this.unitConverter.twipsToUI(maskedParagraphProperties.rightIndent) + unitTypeToString + ";";
+                        paragraphStyle += "margin-top: " + this.unitConverter.twipsToUI(maskedParagraphProperties.spacingBefore) + unitTypeToString + ";";
+                        paragraphStyle += "margin-bottom: " + this.unitConverter.twipsToUI(maskedParagraphProperties.spacingAfter) + unitTypeToString + ";";
                         const topBorderStyle = this.getBorderCssString(maskedParagraphProperties.topBorder);
                         if (topBorderStyle)
                             paragraphStyle += "border-top:" + topBorderStyle + ";";
@@ -396,17 +207,15 @@ export class HtmlExporter {
                             paragraphStyle += HtmlConverter.getCssRules(charProps, charProps.textColor.toRgb(this.colorProvider), false, false, false)
                                 .join(";");
                         }
-                        if (currentParagraph.isInList() && !tableCell)
+                        if (currentParagraph.isInList())
                             resultBuilder.startChild('li');
                         resultBuilder
                             .startChild('p')
                             .configure((e) => {
-                            if (paragraphStyle) {
+                            if (paragraphStyle)
                                 e.style.cssText = paragraphStyle;
-                            }
-                            if (isRunInEmptyParagraph) {
+                            if (isRunInEmptyParagraph)
                                 e.innerHTML = "&nbsp;";
-                            }
                         });
                     }
                 }
@@ -418,6 +227,10 @@ export class HtmlExporter {
                 case RunType.ParagraphRun:
                     if (!isContinueMergingCell) {
                         html.addCallback((builder) => builder.endChild('p'));
+                        if (run.paragraph.isInList()) {
+                            html.addCallback((builder) => builder.endChild('li'));
+                            html.addCallback((builder) => this.endList(model, builder, lists, iterator.currentInterval().end));
+                        }
                         let paragraphEndPosition = run.paragraph.getEndPosition();
                         if (tableCell) {
                             let parentRow = tableCell.parentRow;
@@ -453,10 +266,11 @@ export class HtmlExporter {
                 case RunType.AnchoredPictureRun: {
                     const picRun = run;
                     const charMergProps = run.getCharacterMergedProperties();
-                    const pictureBox = new LayoutPictureBox(charMergProps, charMergProps.getLayoutColorInfo(this.colorProvider), picRun.cacheInfo, picRun.getActualSize().applyConverter(UnitConverter.twipsToPixels));
+                    const pictureBox = new LayoutPictureBox(charMergProps, charMergProps.getLayoutColorInfo(this.colorProvider), picRun.cacheInfo, picRun.getActualSize().applyConverter(UnitConverter.twipsToPixels), picRun.info.nonVisualDrawingProperties.description);
+                    const { cacheInfo, hyperlinkTip, description } = pictureBox;
                     innerHtml
                         .clear()
-                        .addElement(renderer.renderPicture(pictureBox));
+                        .addElement(this.documentRenderer.renderPictureBoxContent(pictureBox.createSize(), cacheInfo, hyperlinkTip, description));
                     break;
                 }
                 case RunType.InlineTextBoxRun:
@@ -507,14 +321,14 @@ export class HtmlExporter {
                     let currentField = subDocument.fields[Field.normedBinaryIndexOf(subDocument.fields, currentPosition)];
                     if (currentField) {
                         let codeText = StringUtils.trim(subDocument.getText(currentField.getCodeInterval()).split("\\")[0]).toUpperCase();
-                        if (codeText == "NUMPAGES")
+                        if (codeText == "NUMPAGES" && isDefined(this.lastMaxNumPages))
                             innerHtml
                                 .clear()
-                                .addElement(this.control.layout.lastMaxNumPages.toString());
-                        else if (codeText == "PAGE")
+                                .addElement(this.lastMaxNumPages.toString());
+                        else if (codeText == "PAGE" && isDefined(this.pageIndex))
                             innerHtml
                                 .clear()
-                                .addElement((this.control.selection.pageIndex + 1).toString());
+                                .addElement((this.pageIndex + 1).toString());
                     }
                     break;
                 default:
@@ -540,7 +354,7 @@ export class HtmlExporter {
             }
             if (html.isEmpty() && !innerHtml.isEmpty()) {
                 const characterProperties = run.getCharacterMergedProperties();
-                const boxStyle = "white-space:pre;" + HtmlConverter.getCssRules(characterProperties, characterProperties.textColor.toRgb(this.colorProvider), run.getType() == RunType.TextRun, false, false).
+                const boxStyle = HtmlConverter.getCssRules(characterProperties, characterProperties.textColor.toRgb(this.colorProvider), run.getType() == RunType.TextRun, false, false).
                     join(";");
                 html
                     .startChild('span')
@@ -594,22 +408,18 @@ export class HtmlExporter {
                 }
             }
             resultBuilder.assignFrom(html);
-            if (listsToEndIndices.length) {
-                for (let i = listsToEndIndices.length - 1; i >= 0; i--)
-                    resultBuilder.endChild(model.numberingLists[listsInInterval[listsToEndIndices[i]].numberingListIndex].getListType() != NumberingType.Bullet ? "ol" : "ul");
-            }
             currentPosition += length;
             remainLength -= length;
         }
-        if (/^<td[^>]*>/gi.test(resultBuilder._getHtmlString())) {
+        if (/^<td[^>]*>/gi.test(resultBuilder.getHtmlString())) {
             const builder = new HtmlBuilder();
             builder.startChild('tr');
             builder.assignFrom(resultBuilder);
             resultBuilder = builder;
         }
-        if (/<\/td>$/gi.test(resultBuilder._getHtmlString()))
+        if (/<\/td>$/gi.test(resultBuilder.getHtmlString()))
             resultBuilder.endChild("tr");
-        if (/^<tr[^>]*>/gi.test(resultBuilder._getHtmlString())) {
+        if (/^<tr[^>]*>/gi.test(resultBuilder.getHtmlString())) {
             const builder = new HtmlBuilder();
             builder
                 .startChild('table')
@@ -620,7 +430,7 @@ export class HtmlExporter {
                 .assignFrom(resultBuilder);
             resultBuilder = builder;
         }
-        if (/<\/tr>$/gi.test(resultBuilder._getHtmlString()))
+        if (/<\/tr>$/gi.test(resultBuilder.getHtmlString()))
             resultBuilder
                 .endChild('tbody')
                 .endChild('table');
@@ -634,32 +444,159 @@ export class HtmlExporter {
                 .endChild('span');
         return resultBuilder;
     }
+    getParagraphsByInterval(subDocument, interval) {
+        const paragraphsInInterval = subDocument.getParagraphsByInterval(interval);
+        const paragraphs = [];
+        for (let i = 0, paragraphInInterval; paragraphInInterval = paragraphsInInterval[i]; i++) {
+            if (interval.containsWithIntervalEnd(paragraphInInterval.getEndPosition()))
+                paragraphs.push(paragraphInInterval);
+        }
+        return paragraphs;
+    }
+    getListsByParagraphs(paragraphs) {
+        const listsInInterval = [];
+        for (let i = 0, paragraph; paragraph = paragraphs[i]; i++) {
+            if (paragraph.isInList()) {
+                const paragraphNumberingListIndex = paragraph.getNumberingListIndex();
+                const paragraphListLevelIndex = paragraph.getListLevelIndex();
+                const paragraphStart = paragraph.startLogPosition.value;
+                const paragraphEnd = paragraph.getEndPosition();
+                let existingItem = null;
+                for (let j = 0; j < listsInInterval.length; j++) {
+                    if (listsInInterval[j].numberingListIndex === paragraphNumberingListIndex
+                        && listsInInterval[j].listLevelIndex === paragraphListLevelIndex) {
+                        existingItem = listsInInterval[j];
+                    }
+                }
+                if (existingItem && (paragraphListLevelIndex === 0 || existingItem.end == paragraphStart
+                    || listsInInterval[listsInInterval.length - 1].listLevelIndex > paragraphListLevelIndex)) {
+                    existingItem.end = paragraphEnd;
+                }
+                else {
+                    listsInInterval.push({
+                        numberingListIndex: paragraphNumberingListIndex,
+                        listLevelIndex: paragraphListLevelIndex,
+                        start: paragraphStart,
+                        end: paragraphEnd,
+                    });
+                }
+                let listLevelIndex = paragraphListLevelIndex;
+                while (listLevelIndex > 0) {
+                    let parentItem = null;
+                    for (let j = 0; j < listsInInterval.length; j++) {
+                        if (listsInInterval[j].listLevelIndex == listLevelIndex - 1)
+                            parentItem = listsInInterval[j];
+                    }
+                    if (parentItem)
+                        parentItem.end = paragraphEnd;
+                    listLevelIndex--;
+                }
+            }
+        }
+        return listsInInterval;
+    }
+    addParentTableRecursively(model, builder, parentCell, paragraphStartPosition) {
+        const parentRow = parentCell.parentRow;
+        const parentTable = parentRow.parentTable;
+        if (parentTable.parentCell)
+            this.addParentTableRecursively(model, builder, parentTable.parentCell, paragraphStartPosition);
+        if (parentTable.getStartPosition() === paragraphStartPosition) {
+            builder
+                .startChild('table')
+                .configure(e => e.style.cssText = this.getTableStyle(model, parentTable))
+                .startChild('tbody');
+        }
+        if (parentRow.getStartPosition() === paragraphStartPosition) {
+            builder.startChild('tr');
+            if (parentRow.gridBefore > 0) {
+                builder
+                    .startChild('td')
+                    .configure(el => {
+                    el.style.cssText = 'mso-cell-special:placeholder';
+                    el.setAttribute('colspan', parentRow.gridBefore.toString());
+                    el.innerHTML = '&nbsp;';
+                })
+                    .endChild('td');
+            }
+        }
+        if (parentCell.startParagraphPosition.value === paragraphStartPosition) {
+            builder
+                .startChild('td')
+                .configure((el) => {
+                el.style.cssText = this.getCellStyle(model, parentCell);
+                if (parentCell.columnSpan > 1)
+                    el.setAttribute('colspan', parentCell.columnSpan.toString());
+            });
+        }
+    }
+    startList(model, subDocument, interval, builder, lists, position) {
+        if (!lists.length)
+            return;
+        let listIndex = lists.findIndex((list) => list.start === position);
+        if (listIndex < 0 && position === interval.start) {
+            const firstParagraph = subDocument.getParagraphByPosition(position);
+            if (firstParagraph.getNumberingListIndex() === lists[0].numberingListIndex)
+                listIndex = 0;
+        }
+        if (listIndex > -1) {
+            const numberingList = model.numberingLists[lists[listIndex].numberingListIndex];
+            const numberingListFormat = numberingList.levels[lists[listIndex].listLevelIndex].getListLevelProperties().format;
+            const numberingListType = numberingList.getListType();
+            let listFormatType = "";
+            switch (numberingListFormat) {
+                case NumberingFormat.Bullet:
+                    listFormatType = "disc";
+                    break;
+                case NumberingFormat.Decimal:
+                    listFormatType = "decimal";
+                    break;
+                case NumberingFormat.LowerLetter:
+                    listFormatType = "lower-alpha";
+                    break;
+                case NumberingFormat.UpperLetter:
+                    listFormatType = "upper-alpha";
+                    break;
+                case NumberingFormat.LowerRoman:
+                    listFormatType = "lower-roman";
+                    break;
+                case NumberingFormat.UpperRoman:
+                    listFormatType = "upper-roman";
+                    break;
+                default:
+                    break;
+            }
+            builder
+                .startChild(numberingListType !== NumberingType.Bullet ? "ol" : "ul")
+                .configure((e) => e.style.cssText = "list-style-type:" + listFormatType);
+        }
+    }
+    endList(model, builder, lists, endPosition) {
+        for (let i = lists.length - 1; i >= 0; i--) {
+            if (lists[i].end === endPosition) {
+                const listType = model.numberingLists[lists[i].numberingListIndex].getListType();
+                lists.splice(i, 1);
+                builder.endChild(listType != NumberingType.Bullet ? "ol" : "ul");
+            }
+        }
+    }
     getHtmlText(text) {
-        let result = new HtmlBuilder();
+        const result = new HtmlBuilder();
         for (let i = 0; i < text.length; i++) {
             const char = text.charAt(i);
-            if (char == RichUtils.specialCharacters.PageBreak)
-                result.addCallback((builder) => {
-                    builder
-                        .startChild('br')
-                        .configure((el) => {
-                        el.style.cssText = "page-break-before:always";
-                    })
-                        .endChild('br');
-                });
-            else if (char == RichUtils.specialCharacters.LineBreak)
-                result.addCallback((builder) => {
-                    builder
-                        .startChild('br')
-                        .endChild('br');
-                });
-            else {
-                result.addCallback((builder) => {
-                    builder.configure((el) => {
-                        el.innerHTML += EncodeUtils.encodeHtml(text.substr(i));
+            switch (char) {
+                case RichUtils.specialCharacters.PageBreak:
+                case RichUtils.specialCharacters.ColumnBreak:
+                case RichUtils.specialCharacters.SectionMark:
+                    result.addCallback((builder) => builder.addBreak("break-before:always"));
+                    break;
+                case RichUtils.specialCharacters.LineBreak:
+                    result.addCallback((builder) => builder.addBreak());
+                    break;
+                default:
+                    result.addCallback((builder) => {
+                        builder.configure((el) => el.innerHTML += EncodeUtils.encodeHtml(text.substring(i)));
                     });
-                });
-                break;
+                    return result;
             }
         }
         return result;
@@ -693,7 +630,7 @@ export class HtmlExporter {
                 default:
                     break;
             }
-            const rgba = this.control.modelManager.model.colorProvider.getRgbaFromModelColor(borderInfo.color);
+            const rgba = this.colorProvider.getRgbaFromModelColor(borderInfo.color);
             if (ColorUtils.getAlpha(rgba) > 0)
                 borderStyle += " " + ColorHelper.getCssStringInternal(rgba);
         }