roosterjs-content-model-dom 0.10.0

package/lib/domToModel/processors/childProcessor.d.ts

@@ -0,0 +1,25 @@
+import { ContentModelBlockGroup, DomToModelContext, ElementProcessor } from 'roosterjs-content-model-types';
+/**
+ * Content Model Element Processor for child elements
+ * @param group The parent block group
+ * @param parent Parent DOM node to process
+ * @param context DOM to Content Model context
+ */
+export declare const childProcessor: ElementProcessor<ParentNode>;
+/**
+ * Helper function for processing child node
+ * @param group The parent block group
+ * @param parent Parent DOM node to process
+ * @param context DOM to Content Model context
+ *
+ */
+export declare function processChildNode(group: ContentModelBlockGroup, child: Node, context: DomToModelContext): void;
+/**
+ * Helper function to handle regular (range based) selection when process child node
+ * @param index Index of current child node in its parent
+ * @param context DOM to Content Model context
+ * @param group The parent block group
+ * @param nodeStartOffset Start offset of current regular selection
+ * @param nodeEndOffset  End offset of current regular selection
+ */
+export declare function handleRegularSelection(index: number, context: DomToModelContext, group: ContentModelBlockGroup, nodeStartOffset: number, nodeEndOffset: number): void;

package/lib/domToModel/processors/childProcessor.js

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.handleRegularSelection = exports.processChildNode = exports.childProcessor = void 0;
+var tslib_1 = require("tslib");
+var addSelectionMarker_1 = require("../utils/addSelectionMarker");
+var getRegularSelectionOffsets_1 = require("../utils/getRegularSelectionOffsets");
+var isNodeOfType_1 = require("../../domUtils/isNodeOfType");
+/**
+ * Content Model Element Processor for child elements
+ * @param group The parent block group
+ * @param parent Parent DOM node to process
+ * @param context DOM to Content Model context
+ */
+var childProcessor = function (group, parent, context) {
+    var _a = (0, tslib_1.__read)((0, getRegularSelectionOffsets_1.getRegularSelectionOffsets)(context, parent), 2), nodeStartOffset = _a[0], nodeEndOffset = _a[1];
+    var index = 0;
+    for (var child = parent.firstChild; child; child = child.nextSibling) {
+        handleRegularSelection(index, context, group, nodeStartOffset, nodeEndOffset);
+        processChildNode(group, child, context);
+        index++;
+    }
+    handleRegularSelection(index, context, group, nodeStartOffset, nodeEndOffset);
+};
+exports.childProcessor = childProcessor;
+/**
+ * Helper function for processing child node
+ * @param group The parent block group
+ * @param parent Parent DOM node to process
+ * @param context DOM to Content Model context
+ *
+ */
+function processChildNode(group, child, context) {
+    if ((0, isNodeOfType_1.isNodeOfType)(child, 1 /* Element */) && child.style.display != 'none') {
+        context.elementProcessors.element(group, child, context);
+    }
+    else if ((0, isNodeOfType_1.isNodeOfType)(child, 3 /* Text */)) {
+        context.elementProcessors['#text'](group, child, context);
+    }
+}
+exports.processChildNode = processChildNode;
+/**
+ * Helper function to handle regular (range based) selection when process child node
+ * @param index Index of current child node in its parent
+ * @param context DOM to Content Model context
+ * @param group The parent block group
+ * @param nodeStartOffset Start offset of current regular selection
+ * @param nodeEndOffset  End offset of current regular selection
+ */
+function handleRegularSelection(index, context, group, nodeStartOffset, nodeEndOffset) {
+    if (index == nodeStartOffset) {
+        context.isInSelection = true;
+        (0, addSelectionMarker_1.addSelectionMarker)(group, context);
+    }
+    if (index == nodeEndOffset) {
+        if (!context.regularSelection.isSelectionCollapsed) {
+            (0, addSelectionMarker_1.addSelectionMarker)(group, context);
+        }
+        context.isInSelection = false;
+    }
+}
+exports.handleRegularSelection = handleRegularSelection;
+//# sourceMappingURL=childProcessor.js.map

package/lib/domToModel/processors/childProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"childProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/childProcessor.ts"],"names":[],"mappings":";;;;AAAA,kEAAiE;AACjE,kFAAiF;AACjF,4DAA2D;AAQ3D;;;;;GAKG;AACI,IAAM,cAAc,GAAiC,UACxD,KAA6B,EAC7B,MAAkB,EAClB,OAA0B;IAEpB,IAAA,KAAA,oBAAmC,IAAA,uDAA0B,EAAC,OAAO,EAAE,MAAM,CAAC,IAAA,EAA7E,eAAe,QAAA,EAAE,aAAa,QAA+C,CAAC;IACrF,IAAI,KAAK,GAAG,CAAC,CAAC;IAEd,KAAK,IAAI,KAAK,GAAG,MAAM,CAAC,UAAU,EAAE,KAAK,EAAE,KAAK,GAAG,KAAK,CAAC,WAAW,EAAE;QAClE,sBAAsB,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,eAAe,EAAE,aAAa,CAAC,CAAC;QAE9E,gBAAgB,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;QAExC,KAAK,EAAE,CAAC;KACX;IAED,sBAAsB,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,eAAe,EAAE,aAAa,CAAC,CAAC;AAClF,CAAC,CAAC;AAjBW,QAAA,cAAc,kBAiBzB;AAEF;;;;;;GAMG;AACH,SAAgB,gBAAgB,CAC5B,KAA6B,EAC7B,KAAW,EACX,OAA0B;IAE1B,IAAI,IAAA,2BAAY,EAAC,KAAK,kBAAmB,IAAI,KAAK,CAAC,KAAK,CAAC,OAAO,IAAI,MAAM,EAAE;QACxE,OAAO,CAAC,iBAAiB,CAAC,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;KAC5D;SAAM,IAAI,IAAA,2BAAY,EAAC,KAAK,eAAgB,EAAE;QAC3C,OAAO,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;KAC7D;AACL,CAAC;AAVD,4CAUC;AAED;;;;;;;GAOG;AACH,SAAgB,sBAAsB,CAClC,KAAa,EACb,OAA0B,EAC1B,KAA6B,EAC7B,eAAuB,EACvB,aAAqB;IAErB,IAAI,KAAK,IAAI,eAAe,EAAE;QAC1B,OAAO,CAAC,aAAa,GAAG,IAAI,CAAC;QAE7B,IAAA,uCAAkB,EAAC,KAAK,EAAE,OAAO,CAAC,CAAC;KACtC;IAED,IAAI,KAAK,IAAI,aAAa,EAAE;QACxB,IAAI,CAAC,OAAO,CAAC,gBAAiB,CAAC,oBAAoB,EAAE;YACjD,IAAA,uCAAkB,EAAC,KAAK,EAAE,OAAO,CAAC,CAAC;SACtC;QACD,OAAO,CAAC,aAAa,GAAG,KAAK,CAAC;KACjC;AACL,CAAC;AAnBD,wDAmBC","sourcesContent":["import { addSelectionMarker } from '../utils/addSelectionMarker';\nimport { getRegularSelectionOffsets } from '../utils/getRegularSelectionOffsets';\nimport { isNodeOfType } from '../../domUtils/isNodeOfType';\nimport { NodeType } from 'roosterjs-editor-types';\nimport {\n    ContentModelBlockGroup,\n    DomToModelContext,\n    ElementProcessor,\n} from 'roosterjs-content-model-types';\n\n/**\n * Content Model Element Processor for child elements\n * @param group The parent block group\n * @param parent Parent DOM node to process\n * @param context DOM to Content Model context\n */\nexport const childProcessor: ElementProcessor<ParentNode> = (\n    group: ContentModelBlockGroup,\n    parent: ParentNode,\n    context: DomToModelContext\n) => {\n    const [nodeStartOffset, nodeEndOffset] = getRegularSelectionOffsets(context, parent);\n    let index = 0;\n\n    for (let child = parent.firstChild; child; child = child.nextSibling) {\n        handleRegularSelection(index, context, group, nodeStartOffset, nodeEndOffset);\n\n        processChildNode(group, child, context);\n\n        index++;\n    }\n\n    handleRegularSelection(index, context, group, nodeStartOffset, nodeEndOffset);\n};\n\n/**\n * Helper function for processing child node\n * @param group The parent block group\n * @param parent Parent DOM node to process\n * @param context DOM to Content Model context\n *\n */\nexport function processChildNode(\n    group: ContentModelBlockGroup,\n    child: Node,\n    context: DomToModelContext\n) {\n    if (isNodeOfType(child, NodeType.Element) && child.style.display != 'none') {\n        context.elementProcessors.element(group, child, context);\n    } else if (isNodeOfType(child, NodeType.Text)) {\n        context.elementProcessors['#text'](group, child, context);\n    }\n}\n\n/**\n * Helper function to handle regular (range based) selection when process child node\n * @param index Index of current child node in its parent\n * @param context DOM to Content Model context\n * @param group The parent block group\n * @param nodeStartOffset Start offset of current regular selection\n * @param nodeEndOffset  End offset of current regular selection\n */\nexport function handleRegularSelection(\n    index: number,\n    context: DomToModelContext,\n    group: ContentModelBlockGroup,\n    nodeStartOffset: number,\n    nodeEndOffset: number\n) {\n    if (index == nodeStartOffset) {\n        context.isInSelection = true;\n\n        addSelectionMarker(group, context);\n    }\n\n    if (index == nodeEndOffset) {\n        if (!context.regularSelection!.isSelectionCollapsed) {\n            addSelectionMarker(group, context);\n        }\n        context.isInSelection = false;\n    }\n}\n"]}

package/lib/domToModel/processors/codeProcessor.d.ts

@@ -0,0 +1,5 @@
+import { ElementProcessor } from 'roosterjs-content-model-types';
+/**
+ * @internal
+ */
+export declare const codeProcessor: ElementProcessor<HTMLElement>;

package/lib/domToModel/processors/codeProcessor.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.codeProcessor = void 0;
+var knownElementProcessor_1 = require("./knownElementProcessor");
+var parseFormat_1 = require("../utils/parseFormat");
+var stackFormat_1 = require("../utils/stackFormat");
+/**
+ * @internal
+ */
+var codeProcessor = function (group, element, context) {
+    (0, stackFormat_1.stackFormat)(context, { code: 'codeDefault' }, function () {
+        (0, parseFormat_1.parseFormat)(element, context.formatParsers.code, context.code.format, context);
+        (0, knownElementProcessor_1.knownElementProcessor)(group, element, context);
+    });
+};
+exports.codeProcessor = codeProcessor;
+//# sourceMappingURL=codeProcessor.js.map

package/lib/domToModel/processors/codeProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"codeProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/codeProcessor.ts"],"names":[],"mappings":";;;AACA,iEAAgE;AAChE,oDAAmD;AACnD,oDAAmD;AAEnD;;GAEG;AACI,IAAM,aAAa,GAAkC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IAChF,IAAA,yBAAW,EAAC,OAAO,EAAE,EAAE,IAAI,EAAE,aAAa,EAAE,EAAE;QAC1C,IAAA,yBAAW,EAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,IAAI,EAAE,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QAE/E,IAAA,6CAAqB,EAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;IACnD,CAAC,CAAC,CAAC;AACP,CAAC,CAAC;AANW,QAAA,aAAa,iBAMxB","sourcesContent":["import { ElementProcessor } from 'roosterjs-content-model-types';\nimport { knownElementProcessor } from './knownElementProcessor';\nimport { parseFormat } from '../utils/parseFormat';\nimport { stackFormat } from '../utils/stackFormat';\n\n/**\n * @internal\n */\nexport const codeProcessor: ElementProcessor<HTMLElement> = (group, element, context) => {\n    stackFormat(context, { code: 'codeDefault' }, () => {\n        parseFormat(element, context.formatParsers.code, context.code.format, context);\n\n        knownElementProcessor(group, element, context);\n    });\n};\n"]}

package/lib/domToModel/processors/delimiterProcessor.d.ts

@@ -0,0 +1,8 @@
+import { ElementProcessor } from 'roosterjs-content-model-types';
+/**
+ * @internal
+ * @param group
+ * @param element
+ * @param context
+ */
+export declare const delimiterProcessor: ElementProcessor<HTMLSpanElement>;

package/lib/domToModel/processors/delimiterProcessor.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.delimiterProcessor = void 0;
+var tslib_1 = require("tslib");
+var getRegularSelectionOffsets_1 = require("../utils/getRegularSelectionOffsets");
+var childProcessor_1 = require("./childProcessor");
+/**
+ * @internal
+ * @param group
+ * @param element
+ * @param context
+ */
+var delimiterProcessor = function (group, element, context) {
+    var index = 0;
+    var _a = (0, tslib_1.__read)((0, getRegularSelectionOffsets_1.getRegularSelectionOffsets)(context, element), 2), nodeStartOffset = _a[0], nodeEndOffset = _a[1];
+    for (var child = element.firstChild; child; child = child.nextSibling) {
+        (0, childProcessor_1.handleRegularSelection)(index, context, group, nodeStartOffset, nodeEndOffset);
+        index++;
+    }
+    (0, childProcessor_1.handleRegularSelection)(index, context, group, nodeStartOffset, nodeEndOffset);
+};
+exports.delimiterProcessor = delimiterProcessor;
+//# sourceMappingURL=delimiterProcessor.js.map

package/lib/domToModel/processors/delimiterProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"delimiterProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/delimiterProcessor.ts"],"names":[],"mappings":";;;;AACA,kFAAiF;AACjF,mDAA0D;AAE1D;;;;;GAKG;AACI,IAAM,kBAAkB,GAAsC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IACzF,IAAI,KAAK,GAAG,CAAC,CAAC;IACR,IAAA,KAAA,oBAAmC,IAAA,uDAA0B,EAAC,OAAO,EAAE,OAAO,CAAC,IAAA,EAA9E,eAAe,QAAA,EAAE,aAAa,QAAgD,CAAC;IAEtF,KAAK,IAAI,KAAK,GAAG,OAAO,CAAC,UAAU,EAAE,KAAK,EAAE,KAAK,GAAG,KAAK,CAAC,WAAW,EAAE;QACnE,IAAA,uCAAsB,EAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,eAAe,EAAE,aAAa,CAAC,CAAC;QAC9E,KAAK,EAAE,CAAC;KACX;IAED,IAAA,uCAAsB,EAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,eAAe,EAAE,aAAa,CAAC,CAAC;AAClF,CAAC,CAAC;AAVW,QAAA,kBAAkB,sBAU7B","sourcesContent":["import { ElementProcessor } from 'roosterjs-content-model-types';\nimport { getRegularSelectionOffsets } from '../utils/getRegularSelectionOffsets';\nimport { handleRegularSelection } from './childProcessor';\n\n/**\n * @internal\n * @param group\n * @param element\n * @param context\n */\nexport const delimiterProcessor: ElementProcessor<HTMLSpanElement> = (group, element, context) => {\n    let index = 0;\n    const [nodeStartOffset, nodeEndOffset] = getRegularSelectionOffsets(context, element);\n\n    for (let child = element.firstChild; child; child = child.nextSibling) {\n        handleRegularSelection(index, context, group, nodeStartOffset, nodeEndOffset);\n        index++;\n    }\n\n    handleRegularSelection(index, context, group, nodeStartOffset, nodeEndOffset);\n};\n"]}

package/lib/domToModel/processors/elementProcessor.d.ts

@@ -0,0 +1,8 @@
+import { ElementProcessor } from 'roosterjs-content-model-types';
+/**
+ * @internal
+ * @param group
+ * @param element
+ * @param context
+ */
+export declare const elementProcessor: ElementProcessor<HTMLElement>;

package/lib/domToModel/processors/elementProcessor.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.elementProcessor = void 0;
+var roosterjs_editor_dom_1 = require("roosterjs-editor-dom");
+/**
+ * @internal
+ * @param group
+ * @param element
+ * @param context
+ */
+var elementProcessor = function (group, element, context) {
+    var tagName = element.tagName.toLowerCase();
+    var processor = (tryGetProcessorForEntity(element, context) ||
+        tryGetProcessorForDelimiter(element, context) ||
+        context.elementProcessors[tagName] ||
+        (tagName.indexOf(':') >= 0 && context.elementProcessors.child) ||
+        context.elementProcessors['*']);
+    processor(group, element, context);
+};
+exports.elementProcessor = elementProcessor;
+function tryGetProcessorForEntity(element, context) {
+    return (element.className && (0, roosterjs_editor_dom_1.getEntityFromElement)(element)) ||
+        element.contentEditable == 'false' // For readonly element, treat as an entity
+        ? context.elementProcessors.entity
+        : null;
+}
+function tryGetProcessorForDelimiter(element, context) {
+    return (0, roosterjs_editor_dom_1.getDelimiterFromElement)(element) ? context.elementProcessors.delimiter : null;
+}
+//# sourceMappingURL=elementProcessor.js.map

package/lib/domToModel/processors/elementProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"elementProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/elementProcessor.ts"],"names":[],"mappings":";;;AAAA,6DAAqF;AAOrF;;;;;GAKG;AACI,IAAM,gBAAgB,GAAkC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IACnF,IAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,WAAW,EAA+B,CAAC;IAC3E,IAAM,SAAS,GAAG,CAAC,wBAAwB,CAAC,OAAO,EAAE,OAAO,CAAC;QACzD,2BAA2B,CAAC,OAAO,EAAE,OAAO,CAAC;QAC7C,OAAO,CAAC,iBAAiB,CAAC,OAAO,CAAC;QAClC,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,OAAO,CAAC,iBAAiB,CAAC,KAAK,CAAC;QAC9D,OAAO,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAA2B,CAAC;IAC9D,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;AACvC,CAAC,CAAC;AARW,QAAA,gBAAgB,oBAQ3B;AAEF,SAAS,wBAAwB,CAAC,OAAoB,EAAE,OAA0B;IAC9E,OAAO,CAAC,OAAO,CAAC,SAAS,IAAI,IAAA,2CAAoB,EAAC,OAAO,CAAC,CAAC;QACvD,OAAO,CAAC,eAAe,IAAI,OAAO,CAAC,2CAA2C;QAC9E,CAAC,CAAC,OAAO,CAAC,iBAAiB,CAAC,MAAM;QAClC,CAAC,CAAC,IAAI,CAAC;AACf,CAAC;AAED,SAAS,2BAA2B,CAAC,OAAa,EAAE,OAA0B;IAC1E,OAAO,IAAA,8CAAuB,EAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC;AACzF,CAAC","sourcesContent":["import { getDelimiterFromElement, getEntityFromElement } from 'roosterjs-editor-dom';\nimport {\n    DomToModelContext,\n    ElementProcessor,\n    ElementProcessorMap,\n} from 'roosterjs-content-model-types';\n\n/**\n * @internal\n * @param group\n * @param element\n * @param context\n */\nexport const elementProcessor: ElementProcessor<HTMLElement> = (group, element, context) => {\n    const tagName = element.tagName.toLowerCase() as keyof ElementProcessorMap;\n    const processor = (tryGetProcessorForEntity(element, context) ||\n        tryGetProcessorForDelimiter(element, context) ||\n        context.elementProcessors[tagName] ||\n        (tagName.indexOf(':') >= 0 && context.elementProcessors.child) ||\n        context.elementProcessors['*']) as ElementProcessor<Node>;\n    processor(group, element, context);\n};\n\nfunction tryGetProcessorForEntity(element: HTMLElement, context: DomToModelContext) {\n    return (element.className && getEntityFromElement(element)) ||\n        element.contentEditable == 'false' // For readonly element, treat as an entity\n        ? context.elementProcessors.entity\n        : null;\n}\n\nfunction tryGetProcessorForDelimiter(element: Node, context: DomToModelContext) {\n    return getDelimiterFromElement(element) ? context.elementProcessors.delimiter : null;\n}\n"]}

package/lib/domToModel/processors/entityProcessor.d.ts

@@ -0,0 +1,8 @@
+import { ElementProcessor } from 'roosterjs-content-model-types';
+/**
+ * Content Model Element Processor for entity
+ * @param group The parent block group
+ * @param parent Parent DOM node to process
+ * @param context DOM to Content Model context
+ */
+export declare const entityProcessor: ElementProcessor<HTMLElement>;

package/lib/domToModel/processors/entityProcessor.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.entityProcessor = void 0;
+var addBlock_1 = require("../../modelApi/common/addBlock");
+var addSegment_1 = require("../../modelApi/common/addSegment");
+var createEntity_1 = require("../../modelApi/creators/createEntity");
+var roosterjs_editor_dom_1 = require("roosterjs-editor-dom");
+var isBlockElement_1 = require("../utils/isBlockElement");
+var stackFormat_1 = require("../utils/stackFormat");
+/**
+ * Content Model Element Processor for entity
+ * @param group The parent block group
+ * @param parent Parent DOM node to process
+ * @param context DOM to Content Model context
+ */
+var entityProcessor = function (group, element, context) {
+    var entity = (0, roosterjs_editor_dom_1.getEntityFromElement)(element);
+    // In Content Model we also treat read only element as an entity since we cannot edit it
+    var _a = entity || { isReadonly: true }, id = _a.id, type = _a.type, isReadonly = _a.isReadonly;
+    var isBlockEntity = (0, isBlockElement_1.isBlockElement)(element, context);
+    (0, stackFormat_1.stackFormat)(context, { segment: isBlockEntity ? 'empty' : undefined, paragraph: 'empty' }, function () {
+        var wrapperToUse = context.allowCacheElement
+            ? element
+            : element.cloneNode(true /* deep */);
+        if (!context.allowCacheElement) {
+            wrapperToUse.style.backgroundColor = element.style.backgroundColor || 'inherit';
+            wrapperToUse.style.color = element.style.color || 'inherit';
+        }
+        var entityModel = (0, createEntity_1.createEntity)(wrapperToUse, isReadonly, context.segmentFormat, id, type);
+        // TODO: Need to handle selection for editable entity
+        if (context.isInSelection) {
+            entityModel.isSelected = true;
+        }
+        if (isBlockEntity) {
+            (0, addBlock_1.addBlock)(group, entityModel);
+        }
+        else {
+            (0, addSegment_1.addSegment)(group, entityModel);
+        }
+    });
+};
+exports.entityProcessor = entityProcessor;
+//# sourceMappingURL=entityProcessor.js.map

package/lib/domToModel/processors/entityProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"entityProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/entityProcessor.ts"],"names":[],"mappings":";;;AAAA,2DAA0D;AAC1D,+DAA8D;AAC9D,qEAAoE;AAEpE,6DAA4D;AAC5D,0DAAyD;AACzD,oDAAmD;AAEnD;;;;;GAKG;AACI,IAAM,eAAe,GAAkC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IAClF,IAAM,MAAM,GAAG,IAAA,2CAAoB,EAAC,OAAO,CAAC,CAAC;IAE7C,wFAAwF;IAClF,IAAA,KAA2B,MAAM,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,EAAvD,EAAE,QAAA,EAAE,IAAI,UAAA,EAAE,UAAU,gBAAmC,CAAC;IAChE,IAAM,aAAa,GAAG,IAAA,+BAAc,EAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IAEvD,IAAA,yBAAW,EACP,OAAO,EACP,EAAE,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,EACpE;QACI,IAAM,YAAY,GAAG,OAAO,CAAC,iBAAiB;YAC1C,CAAC,CAAC,OAAO;YACT,CAAC,CAAE,OAAO,CAAC,SAAS,CAAC,IAAI,CAAC,UAAU,CAAiB,CAAC;QAE1D,IAAI,CAAC,OAAO,CAAC,iBAAiB,EAAE;YAC5B,YAAY,CAAC,KAAK,CAAC,eAAe,GAAG,OAAO,CAAC,KAAK,CAAC,eAAe,IAAI,SAAS,CAAC;YAChF,YAAY,CAAC,KAAK,CAAC,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,KAAK,IAAI,SAAS,CAAC;SAC/D;QAED,IAAM,WAAW,GAAG,IAAA,2BAAY,EAC5B,YAAY,EACZ,UAAU,EACV,OAAO,CAAC,aAAa,EACrB,EAAE,EACF,IAAI,CACP,CAAC;QAEF,qDAAqD;QACrD,IAAI,OAAO,CAAC,aAAa,EAAE;YACvB,WAAW,CAAC,UAAU,GAAG,IAAI,CAAC;SACjC;QAED,IAAI,aAAa,EAAE;YACf,IAAA,mBAAQ,EAAC,KAAK,EAAE,WAAW,CAAC,CAAC;SAChC;aAAM;YACH,IAAA,uBAAU,EAAC,KAAK,EAAE,WAAW,CAAC,CAAC;SAClC;IACL,CAAC,CACJ,CAAC;AACN,CAAC,CAAC;AAxCW,QAAA,eAAe,mBAwC1B","sourcesContent":["import { addBlock } from '../../modelApi/common/addBlock';\nimport { addSegment } from '../../modelApi/common/addSegment';\nimport { createEntity } from '../../modelApi/creators/createEntity';\nimport { ElementProcessor } from 'roosterjs-content-model-types';\nimport { getEntityFromElement } from 'roosterjs-editor-dom';\nimport { isBlockElement } from '../utils/isBlockElement';\nimport { stackFormat } from '../utils/stackFormat';\n\n/**\n * Content Model Element Processor for entity\n * @param group The parent block group\n * @param parent Parent DOM node to process\n * @param context DOM to Content Model context\n */\nexport const entityProcessor: ElementProcessor<HTMLElement> = (group, element, context) => {\n    const entity = getEntityFromElement(element);\n\n    // In Content Model we also treat read only element as an entity since we cannot edit it\n    const { id, type, isReadonly } = entity || { isReadonly: true };\n    const isBlockEntity = isBlockElement(element, context);\n\n    stackFormat(\n        context,\n        { segment: isBlockEntity ? 'empty' : undefined, paragraph: 'empty' },\n        () => {\n            const wrapperToUse = context.allowCacheElement\n                ? element\n                : (element.cloneNode(true /* deep */) as HTMLElement);\n\n            if (!context.allowCacheElement) {\n                wrapperToUse.style.backgroundColor = element.style.backgroundColor || 'inherit';\n                wrapperToUse.style.color = element.style.color || 'inherit';\n            }\n\n            const entityModel = createEntity(\n                wrapperToUse,\n                isReadonly,\n                context.segmentFormat,\n                id,\n                type\n            );\n\n            // TODO: Need to handle selection for editable entity\n            if (context.isInSelection) {\n                entityModel.isSelected = true;\n            }\n\n            if (isBlockEntity) {\n                addBlock(group, entityModel);\n            } else {\n                addSegment(group, entityModel);\n            }\n        }\n    );\n};\n"]}

package/lib/domToModel/processors/fontProcessor.d.ts

@@ -0,0 +1,5 @@
+import { ElementProcessor } from 'roosterjs-content-model-types';
+/**
+ * @internal
+ */
+export declare const fontProcessor: ElementProcessor<HTMLFontElement>;

package/lib/domToModel/processors/fontProcessor.js

@@ -0,0 +1,48 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.fontProcessor = void 0;
+var isBlockElement_1 = require("../utils/isBlockElement");
+var parseFormat_1 = require("../utils/parseFormat");
+var stackFormat_1 = require("../utils/stackFormat");
+var FontSizes = ['10px', '13px', '16px', '18px', '24px', '32px', '48px'];
+function getFontSize(size) {
+    var intSize = parseInt(size || '');
+    if (Number.isNaN(intSize)) {
+        return undefined;
+    }
+    else if (intSize < 1) {
+        return FontSizes[0];
+    }
+    else if (intSize > FontSizes.length) {
+        return FontSizes[FontSizes.length - 1];
+    }
+    else {
+        return FontSizes[intSize - 1];
+    }
+}
+/**
+ * @internal
+ */
+var fontProcessor = function (group, element, context) {
+    (0, stackFormat_1.stackFormat)(context, {
+        segment: (0, isBlockElement_1.isBlockElement)(element, context) ? 'shallowCloneForBlock' : 'shallowClone',
+    }, function () {
+        var fontFamily = element.getAttribute('face');
+        var fontSize = getFontSize(element.getAttribute('size'));
+        var textColor = element.getAttribute('color');
+        var format = context.segmentFormat;
+        if (fontFamily) {
+            format.fontFamily = fontFamily;
+        }
+        if (fontSize) {
+            format.fontSize = fontSize;
+        }
+        if (textColor) {
+            format.textColor = textColor;
+        }
+        (0, parseFormat_1.parseFormat)(element, context.formatParsers.segment, context.segmentFormat, context);
+        context.elementProcessors.child(group, element, context);
+    });
+};
+exports.fontProcessor = fontProcessor;
+//# sourceMappingURL=fontProcessor.js.map

package/lib/domToModel/processors/fontProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fontProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/fontProcessor.ts"],"names":[],"mappings":";;;AACA,0DAAyD;AACzD,oDAAmD;AACnD,oDAAmD;AAEnD,IAAM,SAAS,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;AAE3E,SAAS,WAAW,CAAC,IAAmB;IACpC,IAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC;IAErC,IAAI,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE;QACvB,OAAO,SAAS,CAAC;KACpB;SAAM,IAAI,OAAO,GAAG,CAAC,EAAE;QACpB,OAAO,SAAS,CAAC,CAAC,CAAC,CAAC;KACvB;SAAM,IAAI,OAAO,GAAG,SAAS,CAAC,MAAM,EAAE;QACnC,OAAO,SAAS,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;KAC1C;SAAM;QACH,OAAO,SAAS,CAAC,OAAO,GAAG,CAAC,CAAC,CAAC;KACjC;AACL,CAAC;AAED;;GAEG;AACI,IAAM,aAAa,GAAsC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IACpF,IAAA,yBAAW,EACP,OAAO,EACP;QACI,OAAO,EAAE,IAAA,+BAAc,EAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,cAAc;KACtF,EACD;QACI,IAAM,UAAU,GAAG,OAAO,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;QAChD,IAAM,QAAQ,GAAG,WAAW,CAAC,OAAO,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC;QAC3D,IAAM,SAAS,GAAG,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;QAChD,IAAM,MAAM,GAAG,OAAO,CAAC,aAAa,CAAC;QAErC,IAAI,UAAU,EAAE;YACZ,MAAM,CAAC,UAAU,GAAG,UAAU,CAAC;SAClC;QAED,IAAI,QAAQ,EAAE;YACV,MAAM,CAAC,QAAQ,GAAG,QAAQ,CAAC;SAC9B;QAED,IAAI,SAAS,EAAE;YACX,MAAM,CAAC,SAAS,GAAG,SAAS,CAAC;SAChC;QAED,IAAA,yBAAW,EAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,EAAE,OAAO,CAAC,CAAC;QAEpF,OAAO,CAAC,iBAAiB,CAAC,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;IAC7D,CAAC,CACJ,CAAC;AACN,CAAC,CAAC;AA7BW,QAAA,aAAa,iBA6BxB","sourcesContent":["import { ElementProcessor } from 'roosterjs-content-model-types';\nimport { isBlockElement } from '../utils/isBlockElement';\nimport { parseFormat } from '../utils/parseFormat';\nimport { stackFormat } from '../utils/stackFormat';\n\nconst FontSizes = ['10px', '13px', '16px', '18px', '24px', '32px', '48px'];\n\nfunction getFontSize(size: string | null) {\n    const intSize = parseInt(size || '');\n\n    if (Number.isNaN(intSize)) {\n        return undefined;\n    } else if (intSize < 1) {\n        return FontSizes[0];\n    } else if (intSize > FontSizes.length) {\n        return FontSizes[FontSizes.length - 1];\n    } else {\n        return FontSizes[intSize - 1];\n    }\n}\n\n/**\n * @internal\n */\nexport const fontProcessor: ElementProcessor<HTMLFontElement> = (group, element, context) => {\n    stackFormat(\n        context,\n        {\n            segment: isBlockElement(element, context) ? 'shallowCloneForBlock' : 'shallowClone',\n        },\n        () => {\n            const fontFamily = element.getAttribute('face');\n            const fontSize = getFontSize(element.getAttribute('size'));\n            const textColor = element.getAttribute('color');\n            const format = context.segmentFormat;\n\n            if (fontFamily) {\n                format.fontFamily = fontFamily;\n            }\n\n            if (fontSize) {\n                format.fontSize = fontSize;\n            }\n\n            if (textColor) {\n                format.textColor = textColor;\n            }\n\n            parseFormat(element, context.formatParsers.segment, context.segmentFormat, context);\n\n            context.elementProcessors.child(group, element, context);\n        }\n    );\n};\n"]}

package/lib/domToModel/processors/formatContainerProcessor.d.ts

@@ -0,0 +1,9 @@
+import { ElementProcessor, MarginFormat, PaddingFormat } from 'roosterjs-content-model-types';
+/**
+ * @internal
+ */
+export declare const ContextStyles: (keyof (MarginFormat & PaddingFormat))[];
+/**
+ * @internal
+ */
+export declare const formatContainerProcessor: ElementProcessor<HTMLElement>;

package/lib/domToModel/processors/formatContainerProcessor.js

@@ -0,0 +1,71 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.formatContainerProcessor = exports.ContextStyles = void 0;
+var tslib_1 = require("tslib");
+var addBlock_1 = require("../../modelApi/common/addBlock");
+var createFormatContainer_1 = require("../../modelApi/creators/createFormatContainer");
+var createParagraph_1 = require("../../modelApi/creators/createParagraph");
+var getDefaultStyle_1 = require("../utils/getDefaultStyle");
+var parseFormat_1 = require("../utils/parseFormat");
+var setParagraphNotImplicit_1 = require("../../modelApi/block/setParagraphNotImplicit");
+var stackFormat_1 = require("../utils/stackFormat");
+/**
+ * @internal
+ */
+exports.ContextStyles = [
+    'marginLeft',
+    'marginRight',
+    'paddingLeft',
+    'paddingRight',
+];
+/**
+ * @internal
+ */
+var formatContainerProcessor = function (group, element, context) {
+    (0, stackFormat_1.stackFormat)(context, { segment: 'shallowCloneForBlock', paragraph: 'shallowClone' }, function () {
+        (0, parseFormat_1.parseFormat)(element, context.formatParsers.block, context.blockFormat, context);
+        (0, parseFormat_1.parseFormat)(element, context.formatParsers.segmentOnBlock, context.segmentFormat, context);
+        var format = (0, tslib_1.__assign)({}, context.blockFormat);
+        (0, parseFormat_1.parseFormat)(element, context.formatParsers.container, format, context);
+        var tagName = (0, getDefaultStyle_1.getDefaultStyle)(element, context).display == 'block'
+            ? element.tagName.toLowerCase()
+            : 'div';
+        var formatContainer = (0, createFormatContainer_1.createFormatContainer)(tagName, format);
+        // It is possible to inherit margin left/right styles from parent DIV or other containers,
+        // since we are going into a deeper level of format container now,
+        // the container will render these styles so no need to keep them in context format
+        exports.ContextStyles.forEach(function (style) {
+            delete context.blockFormat[style];
+        });
+        context.elementProcessors.child(formatContainer, element, context);
+        if (element.style.fontSize && parseInt(element.style.fontSize) == 0) {
+            formatContainer.zeroFontSize = true;
+        }
+        if (shouldFallbackToParagraph(formatContainer)) {
+            // For DIV container that only has one paragraph child, container style can be merged into paragraph
+            // and no need to have this container
+            var paragraph = formatContainer.blocks[0];
+            if (formatContainer.zeroFontSize) {
+                paragraph.segmentFormat = Object.assign({}, paragraph.segmentFormat, {
+                    fontSize: '0',
+                });
+            }
+            Object.assign(paragraph.format, formatContainer.format);
+            (0, setParagraphNotImplicit_1.setParagraphNotImplicit)(paragraph);
+            (0, addBlock_1.addBlock)(group, paragraph);
+        }
+        else {
+            (0, addBlock_1.addBlock)(group, formatContainer);
+        }
+    });
+    (0, addBlock_1.addBlock)(group, (0, createParagraph_1.createParagraph)(true /*isImplicit*/, context.blockFormat));
+};
+exports.formatContainerProcessor = formatContainerProcessor;
+function shouldFallbackToParagraph(formatContainer) {
+    var firstChild = formatContainer.blocks[0];
+    return (formatContainer.tagName == 'div' &&
+        formatContainer.blocks.length == 1 &&
+        firstChild.blockType == 'Paragraph' &&
+        firstChild.isImplicit);
+}
+//# sourceMappingURL=formatContainerProcessor.js.map

package/lib/domToModel/processors/formatContainerProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"formatContainerProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/formatContainerProcessor.ts"],"names":[],"mappings":";;;;AAAA,2DAA0D;AAC1D,uFAAsF;AACtF,2EAA0E;AAC1E,4DAA2D;AAC3D,oDAAmD;AACnD,wFAAuF;AACvF,oDAAmD;AAUnD;;GAEG;AACU,QAAA,aAAa,GAA6C;IACnE,YAAY;IACZ,aAAa;IACb,aAAa;IACb,cAAc;CACjB,CAAC;AAEF;;GAEG;AACI,IAAM,wBAAwB,GAAkC,UACnE,KAAK,EACL,OAAO,EACP,OAAO;IAEP,IAAA,yBAAW,EAAC,OAAO,EAAE,EAAE,OAAO,EAAE,sBAAsB,EAAE,SAAS,EAAE,cAAc,EAAE,EAAE;QACjF,IAAA,yBAAW,EAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,KAAK,EAAE,OAAO,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC;QAChF,IAAA,yBAAW,EAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,cAAc,EAAE,OAAO,CAAC,aAAa,EAAE,OAAO,CAAC,CAAC;QAE3F,IAAM,MAAM,6BACL,OAAO,CAAC,WAAW,CACzB,CAAC;QAEF,IAAA,yBAAW,EAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,SAAS,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC;QAEvE,IAAM,OAAO,GACT,IAAA,iCAAe,EAAC,OAAO,EAAE,OAAO,CAAC,CAAC,OAAO,IAAI,OAAO;YAChD,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,WAAW,EAAE;YAC/B,CAAC,CAAC,KAAK,CAAC;QAChB,IAAM,eAAe,GAAG,IAAA,6CAAqB,EAAC,OAAO,EAAE,MAAM,CAAC,CAAC;QAE/D,0FAA0F;QAC1F,kEAAkE;QAClE,mFAAmF;QACnF,qBAAa,CAAC,OAAO,CAAC,UAAA,KAAK;YACvB,OAAO,OAAO,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QACtC,CAAC,CAAC,CAAC;QAEH,OAAO,CAAC,iBAAiB,CAAC,KAAK,CAAC,eAAe,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;QAEnE,IAAI,OAAO,CAAC,KAAK,CAAC,QAAQ,IAAI,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE;YACjE,eAAe,CAAC,YAAY,GAAG,IAAI,CAAC;SACvC;QAED,IAAI,yBAAyB,CAAC,eAAe,CAAC,EAAE;YAC5C,oGAAoG;YACpG,qCAAqC;YACrC,IAAM,SAAS,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC,CAA0B,CAAC;YAErE,IAAI,eAAe,CAAC,YAAY,EAAE;gBAC9B,SAAS,CAAC,aAAa,GAAG,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,SAAS,CAAC,aAAa,EAAE;oBACjE,QAAQ,EAAE,GAAG;iBAChB,CAAC,CAAC;aACN;YAED,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;YACxD,IAAA,iDAAuB,EAAC,SAAS,CAAC,CAAC;YACnC,IAAA,mBAAQ,EAAC,KAAK,EAAE,SAAS,CAAC,CAAC;SAC9B;aAAM;YACH,IAAA,mBAAQ,EAAC,KAAK,EAAE,eAAe,CAAC,CAAC;SACpC;IACL,CAAC,CAAC,CAAC;IAEH,IAAA,mBAAQ,EAAC,KAAK,EAAE,IAAA,iCAAe,EAAC,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC;AAC/E,CAAC,CAAC;AAtDW,QAAA,wBAAwB,4BAsDnC;AAEF,SAAS,yBAAyB,CAAC,eAA4C;IAC3E,IAAM,UAAU,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAE7C,OAAO,CACH,eAAe,CAAC,OAAO,IAAI,KAAK;QAChC,eAAe,CAAC,MAAM,CAAC,MAAM,IAAI,CAAC;QAClC,UAAU,CAAC,SAAS,IAAI,WAAW;QACnC,UAAU,CAAC,UAAU,CACxB,CAAC;AACN,CAAC","sourcesContent":["import { addBlock } from '../../modelApi/common/addBlock';\nimport { createFormatContainer } from '../../modelApi/creators/createFormatContainer';\nimport { createParagraph } from '../../modelApi/creators/createParagraph';\nimport { getDefaultStyle } from '../utils/getDefaultStyle';\nimport { parseFormat } from '../utils/parseFormat';\nimport { setParagraphNotImplicit } from '../../modelApi/block/setParagraphNotImplicit';\nimport { stackFormat } from '../utils/stackFormat';\nimport {\n    ContentModelFormatContainer,\n    ContentModelFormatContainerFormat,\n    ContentModelParagraph,\n    ElementProcessor,\n    MarginFormat,\n    PaddingFormat,\n} from 'roosterjs-content-model-types';\n\n/**\n * @internal\n */\nexport const ContextStyles: (keyof (MarginFormat & PaddingFormat))[] = [\n    'marginLeft',\n    'marginRight',\n    'paddingLeft',\n    'paddingRight',\n];\n\n/**\n * @internal\n */\nexport const formatContainerProcessor: ElementProcessor<HTMLElement> = (\n    group,\n    element,\n    context\n) => {\n    stackFormat(context, { segment: 'shallowCloneForBlock', paragraph: 'shallowClone' }, () => {\n        parseFormat(element, context.formatParsers.block, context.blockFormat, context);\n        parseFormat(element, context.formatParsers.segmentOnBlock, context.segmentFormat, context);\n\n        const format: ContentModelFormatContainerFormat = {\n            ...context.blockFormat,\n        };\n\n        parseFormat(element, context.formatParsers.container, format, context);\n\n        const tagName =\n            getDefaultStyle(element, context).display == 'block'\n                ? element.tagName.toLowerCase()\n                : 'div';\n        const formatContainer = createFormatContainer(tagName, format);\n\n        // It is possible to inherit margin left/right styles from parent DIV or other containers,\n        // since we are going into a deeper level of format container now,\n        // the container will render these styles so no need to keep them in context format\n        ContextStyles.forEach(style => {\n            delete context.blockFormat[style];\n        });\n\n        context.elementProcessors.child(formatContainer, element, context);\n\n        if (element.style.fontSize && parseInt(element.style.fontSize) == 0) {\n            formatContainer.zeroFontSize = true;\n        }\n\n        if (shouldFallbackToParagraph(formatContainer)) {\n            // For DIV container that only has one paragraph child, container style can be merged into paragraph\n            // and no need to have this container\n            const paragraph = formatContainer.blocks[0] as ContentModelParagraph;\n\n            if (formatContainer.zeroFontSize) {\n                paragraph.segmentFormat = Object.assign({}, paragraph.segmentFormat, {\n                    fontSize: '0',\n                });\n            }\n\n            Object.assign(paragraph.format, formatContainer.format);\n            setParagraphNotImplicit(paragraph);\n            addBlock(group, paragraph);\n        } else {\n            addBlock(group, formatContainer);\n        }\n    });\n\n    addBlock(group, createParagraph(true /*isImplicit*/, context.blockFormat));\n};\n\nfunction shouldFallbackToParagraph(formatContainer: ContentModelFormatContainer) {\n    const firstChild = formatContainer.blocks[0];\n\n    return (\n        formatContainer.tagName == 'div' &&\n        formatContainer.blocks.length == 1 &&\n        firstChild.blockType == 'Paragraph' &&\n        firstChild.isImplicit\n    );\n}\n"]}

package/lib/domToModel/processors/generalProcessor.d.ts

@@ -0,0 +1,5 @@
+import { ElementProcessor } from 'roosterjs-content-model-types';
+/**
+ * @internal
+ */
+export declare const generalProcessor: ElementProcessor<HTMLElement>;

package/lib/domToModel/processors/generalProcessor.js

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generalProcessor = void 0;
+var addBlock_1 = require("../../modelApi/common/addBlock");
+var addDecorators_1 = require("../../modelApi/common/addDecorators");
+var addSegment_1 = require("../../modelApi/common/addSegment");
+var createGeneralBlock_1 = require("../../modelApi/creators/createGeneralBlock");
+var createGeneralSegment_1 = require("../../modelApi/creators/createGeneralSegment");
+var isBlockElement_1 = require("../utils/isBlockElement");
+var stackFormat_1 = require("../utils/stackFormat");
+var generalBlockProcessor = function (group, element, context) {
+    var block = (0, createGeneralBlock_1.createGeneralBlock)(element);
+    var isSelectedBefore = context.isInSelection;
+    (0, stackFormat_1.stackFormat)(context, {
+        segment: 'empty',
+        paragraph: 'empty',
+        link: 'empty',
+    }, function () {
+        (0, addBlock_1.addBlock)(group, block);
+        context.elementProcessors.child(block, element, context);
+    });
+    if (isSelectedBefore && context.isInSelection) {
+        block.isSelected = true;
+    }
+};
+var generalSegmentProcessor = function (group, element, context) {
+    var segment = (0, createGeneralSegment_1.createGeneralSegment)(element, context.segmentFormat);
+    var isSelectedBefore = context.isInSelection;
+    (0, addDecorators_1.addDecorators)(segment, context);
+    (0, addSegment_1.addSegment)(group, segment);
+    (0, stackFormat_1.stackFormat)(context, {
+        segment: 'empty' /*clearFormat, General segment will include all properties and styles when generate back to HTML, so no need to carry over existing segment format*/,
+    }, function () {
+        context.elementProcessors.child(segment, element, context);
+    });
+    if (isSelectedBefore && context.isInSelection) {
+        segment.isSelected = true;
+    }
+};
+/**
+ * @internal
+ */
+var generalProcessor = function (group, element, context) {
+    var processor = (0, isBlockElement_1.isBlockElement)(element, context)
+        ? generalBlockProcessor
+        : generalSegmentProcessor;
+    processor(group, element, context);
+};
+exports.generalProcessor = generalProcessor;
+//# sourceMappingURL=generalProcessor.js.map

package/lib/domToModel/processors/generalProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"generalProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/generalProcessor.ts"],"names":[],"mappings":";;;AAAA,2DAA0D;AAC1D,qEAAoE;AACpE,+DAA8D;AAC9D,iFAAgF;AAChF,qFAAoF;AAEpF,0DAAyD;AACzD,oDAAmD;AAEnD,IAAM,qBAAqB,GAAkC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IACjF,IAAM,KAAK,GAAG,IAAA,uCAAkB,EAAC,OAAO,CAAC,CAAC;IAC1C,IAAM,gBAAgB,GAAG,OAAO,CAAC,aAAa,CAAC;IAE/C,IAAA,yBAAW,EACP,OAAO,EACP;QACI,OAAO,EAAE,OAAO;QAChB,SAAS,EAAE,OAAO;QAClB,IAAI,EAAE,OAAO;KAChB,EACD;QACI,IAAA,mBAAQ,EAAC,KAAK,EAAE,KAAK,CAAC,CAAC;QAEvB,OAAO,CAAC,iBAAiB,CAAC,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;IAC7D,CAAC,CACJ,CAAC;IAEF,IAAI,gBAAgB,IAAI,OAAO,CAAC,aAAa,EAAE;QAC3C,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC;KAC3B;AACL,CAAC,CAAC;AAEF,IAAM,uBAAuB,GAAkC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IACnF,IAAM,OAAO,GAAG,IAAA,2CAAoB,EAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;IACrE,IAAM,gBAAgB,GAAG,OAAO,CAAC,aAAa,CAAC;IAE/C,IAAA,6BAAa,EAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IAChC,IAAA,uBAAU,EAAC,KAAK,EAAE,OAAO,CAAC,CAAC;IAE3B,IAAA,yBAAW,EACP,OAAO,EACP;QACI,OAAO,EACH,OAAO,CAAC,oJAAoJ;KACnK,EACD;QACI,OAAO,CAAC,iBAAiB,CAAC,KAAK,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;IAC/D,CAAC,CACJ,CAAC;IAEF,IAAI,gBAAgB,IAAI,OAAO,CAAC,aAAa,EAAE;QAC3C,OAAO,CAAC,UAAU,GAAG,IAAI,CAAC;KAC7B;AACL,CAAC,CAAC;AAEF;;GAEG;AACI,IAAM,gBAAgB,GAAkC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IACnF,IAAM,SAAS,GAAG,IAAA,+BAAc,EAAC,OAAO,EAAE,OAAO,CAAC;QAC9C,CAAC,CAAC,qBAAqB;QACvB,CAAC,CAAC,uBAAuB,CAAC;IAE9B,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;AACvC,CAAC,CAAC;AANW,QAAA,gBAAgB,oBAM3B","sourcesContent":["import { addBlock } from '../../modelApi/common/addBlock';\nimport { addDecorators } from '../../modelApi/common/addDecorators';\nimport { addSegment } from '../../modelApi/common/addSegment';\nimport { createGeneralBlock } from '../../modelApi/creators/createGeneralBlock';\nimport { createGeneralSegment } from '../../modelApi/creators/createGeneralSegment';\nimport { ElementProcessor } from 'roosterjs-content-model-types';\nimport { isBlockElement } from '../utils/isBlockElement';\nimport { stackFormat } from '../utils/stackFormat';\n\nconst generalBlockProcessor: ElementProcessor<HTMLElement> = (group, element, context) => {\n    const block = createGeneralBlock(element);\n    const isSelectedBefore = context.isInSelection;\n\n    stackFormat(\n        context,\n        {\n            segment: 'empty',\n            paragraph: 'empty',\n            link: 'empty',\n        },\n        () => {\n            addBlock(group, block);\n\n            context.elementProcessors.child(block, element, context);\n        }\n    );\n\n    if (isSelectedBefore && context.isInSelection) {\n        block.isSelected = true;\n    }\n};\n\nconst generalSegmentProcessor: ElementProcessor<HTMLElement> = (group, element, context) => {\n    const segment = createGeneralSegment(element, context.segmentFormat);\n    const isSelectedBefore = context.isInSelection;\n\n    addDecorators(segment, context);\n    addSegment(group, segment);\n\n    stackFormat(\n        context,\n        {\n            segment:\n                'empty' /*clearFormat, General segment will include all properties and styles when generate back to HTML, so no need to carry over existing segment format*/,\n        },\n        () => {\n            context.elementProcessors.child(segment, element, context);\n        }\n    );\n\n    if (isSelectedBefore && context.isInSelection) {\n        segment.isSelected = true;\n    }\n};\n\n/**\n * @internal\n */\nexport const generalProcessor: ElementProcessor<HTMLElement> = (group, element, context) => {\n    const processor = isBlockElement(element, context)\n        ? generalBlockProcessor\n        : generalSegmentProcessor;\n\n    processor(group, element, context);\n};\n"]}

package/lib/domToModel/processors/headingProcessor.d.ts

@@ -0,0 +1,5 @@
+import { ElementProcessor } from 'roosterjs-content-model-types';
+/**
+ * @internal
+ */
+export declare const headingProcessor: ElementProcessor<HTMLHeadingElement>;

package/lib/domToModel/processors/headingProcessor.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.headingProcessor = void 0;
+var addBlock_1 = require("../../modelApi/common/addBlock");
+var blockProcessor_1 = require("./blockProcessor");
+var createParagraph_1 = require("../../modelApi/creators/createParagraph");
+var createParagraphDecorator_1 = require("../../modelApi/creators/createParagraphDecorator");
+var parseFormat_1 = require("../utils/parseFormat");
+var stackFormat_1 = require("../utils/stackFormat");
+/**
+ * @internal
+ */
+var headingProcessor = function (group, element, context) {
+    (0, stackFormat_1.stackFormat)(context, { segment: 'shallowCloneForBlock', paragraph: 'shallowClone', blockDecorator: 'empty' }, function () {
+        var segmentFormat = {};
+        (0, parseFormat_1.parseFormat)(element, context.formatParsers.segmentOnBlock, segmentFormat, context);
+        context.blockDecorator = (0, createParagraphDecorator_1.createParagraphDecorator)(element.tagName, segmentFormat);
+        (0, blockProcessor_1.blockProcessor)(group, element, context);
+    });
+    (0, addBlock_1.addBlock)(group, (0, createParagraph_1.createParagraph)(true /*isImplicit*/, context.blockFormat));
+};
+exports.headingProcessor = headingProcessor;
+//# sourceMappingURL=headingProcessor.js.map

package/lib/domToModel/processors/headingProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"headingProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/headingProcessor.ts"],"names":[],"mappings":";;;AAAA,2DAA0D;AAC1D,mDAAkD;AAElD,2EAA0E;AAC1E,6FAA4F;AAC5F,oDAAmD;AACnD,oDAAmD;AAEnD;;GAEG;AACI,IAAM,gBAAgB,GAAyC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IAC1F,IAAA,yBAAW,EACP,OAAO,EACP,EAAE,OAAO,EAAE,sBAAsB,EAAE,SAAS,EAAE,cAAc,EAAE,cAAc,EAAE,OAAO,EAAE,EACvF;QACI,IAAM,aAAa,GAA8B,EAAE,CAAC;QAEpD,IAAA,yBAAW,EAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,cAAc,EAAE,aAAa,EAAE,OAAO,CAAC,CAAC;QAEnF,OAAO,CAAC,cAAc,GAAG,IAAA,mDAAwB,EAAC,OAAO,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC;QAElF,IAAA,+BAAc,EAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;IAC5C,CAAC,CACJ,CAAC;IAEF,IAAA,mBAAQ,EAAC,KAAK,EAAE,IAAA,iCAAe,EAAC,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC;AAC/E,CAAC,CAAC;AAhBW,QAAA,gBAAgB,oBAgB3B","sourcesContent":["import { addBlock } from '../../modelApi/common/addBlock';\nimport { blockProcessor } from './blockProcessor';\nimport { ContentModelSegmentFormat, ElementProcessor } from 'roosterjs-content-model-types';\nimport { createParagraph } from '../../modelApi/creators/createParagraph';\nimport { createParagraphDecorator } from '../../modelApi/creators/createParagraphDecorator';\nimport { parseFormat } from '../utils/parseFormat';\nimport { stackFormat } from '../utils/stackFormat';\n\n/**\n * @internal\n */\nexport const headingProcessor: ElementProcessor<HTMLHeadingElement> = (group, element, context) => {\n    stackFormat(\n        context,\n        { segment: 'shallowCloneForBlock', paragraph: 'shallowClone', blockDecorator: 'empty' },\n        () => {\n            const segmentFormat: ContentModelSegmentFormat = {};\n\n            parseFormat(element, context.formatParsers.segmentOnBlock, segmentFormat, context);\n\n            context.blockDecorator = createParagraphDecorator(element.tagName, segmentFormat);\n\n            blockProcessor(group, element, context);\n        }\n    );\n\n    addBlock(group, createParagraph(true /*isImplicit*/, context.blockFormat));\n};\n"]}

package/lib/domToModel/processors/hrProcessor.d.ts

@@ -0,0 +1,5 @@
+import { ElementProcessor } from 'roosterjs-content-model-types';
+/**
+ * @internal
+ */
+export declare const hrProcessor: ElementProcessor<HTMLHRElement>;

package/lib/domToModel/processors/hrProcessor.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.hrProcessor = void 0;
+var addBlock_1 = require("../../modelApi/common/addBlock");
+var createDivider_1 = require("../../modelApi/creators/createDivider");
+var parseFormat_1 = require("../utils/parseFormat");
+var stackFormat_1 = require("../utils/stackFormat");
+/**
+ * @internal
+ */
+var hrProcessor = function (group, element, context) {
+    (0, stackFormat_1.stackFormat)(context, {
+        paragraph: 'shallowClone',
+    }, function () {
+        (0, parseFormat_1.parseFormat)(element, context.formatParsers.divider, context.blockFormat, context);
+        var hr = (0, createDivider_1.createDivider)('hr', context.blockFormat);
+        if (element.size) {
+            hr.size = element.size;
+        }
+        if (context.isInSelection) {
+            hr.isSelected = true;
+        }
+        (0, addBlock_1.addBlock)(group, hr);
+    });
+};
+exports.hrProcessor = hrProcessor;
+//# sourceMappingURL=hrProcessor.js.map

package/lib/domToModel/processors/hrProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hrProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/hrProcessor.ts"],"names":[],"mappings":";;;AAAA,2DAA0D;AAC1D,uEAAsE;AAEtE,oDAAmD;AACnD,oDAAmD;AAEnD;;GAEG;AACI,IAAM,WAAW,GAAoC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IAChF,IAAA,yBAAW,EACP,OAAO,EACP;QACI,SAAS,EAAE,cAAc;KAC5B,EACD;QACI,IAAA,yBAAW,EAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,OAAO,EAAE,OAAO,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC;QAElF,IAAM,EAAE,GAAG,IAAA,6BAAa,EAAC,IAAI,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;QAEpD,IAAI,OAAO,CAAC,IAAI,EAAE;YACd,EAAE,CAAC,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;SAC1B;QAED,IAAI,OAAO,CAAC,aAAa,EAAE;YACvB,EAAE,CAAC,UAAU,GAAG,IAAI,CAAC;SACxB;QAED,IAAA,mBAAQ,EAAC,KAAK,EAAE,EAAE,CAAC,CAAC;IACxB,CAAC,CACJ,CAAC;AACN,CAAC,CAAC;AAtBW,QAAA,WAAW,eAsBtB","sourcesContent":["import { addBlock } from '../../modelApi/common/addBlock';\nimport { createDivider } from '../../modelApi/creators/createDivider';\nimport { ElementProcessor } from 'roosterjs-content-model-types';\nimport { parseFormat } from '../utils/parseFormat';\nimport { stackFormat } from '../utils/stackFormat';\n\n/**\n * @internal\n */\nexport const hrProcessor: ElementProcessor<HTMLHRElement> = (group, element, context) => {\n    stackFormat(\n        context,\n        {\n            paragraph: 'shallowClone',\n        },\n        () => {\n            parseFormat(element, context.formatParsers.divider, context.blockFormat, context);\n\n            const hr = createDivider('hr', context.blockFormat);\n\n            if (element.size) {\n                hr.size = element.size;\n            }\n\n            if (context.isInSelection) {\n                hr.isSelected = true;\n            }\n\n            addBlock(group, hr);\n        }\n    );\n};\n"]}

package/lib/domToModel/processors/imageProcessor.d.ts

@@ -0,0 +1,5 @@
+import { ElementProcessor } from 'roosterjs-content-model-types';
+/**
+ * @internal
+ */
+export declare const imageProcessor: ElementProcessor<HTMLImageElement>;