roosterjs-content-model-dom 0.10.0

package/lib-mjs/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-mjs/domToModel/processors/headingProcessor.js

@@ -0,0 +1,19 @@
+import { addBlock } from '../../modelApi/common/addBlock';
+import { blockProcessor } from './blockProcessor';
+import { createParagraph } from '../../modelApi/creators/createParagraph';
+import { createParagraphDecorator } from '../../modelApi/creators/createParagraphDecorator';
+import { parseFormat } from '../utils/parseFormat';
+import { stackFormat } from '../utils/stackFormat';
+/**
+ * @internal
+ */
+export var headingProcessor = function (group, element, context) {
+    stackFormat(context, { segment: 'shallowCloneForBlock', paragraph: 'shallowClone', blockDecorator: 'empty' }, function () {
+        var segmentFormat = {};
+        parseFormat(element, context.formatParsers.segmentOnBlock, segmentFormat, context);
+        context.blockDecorator = createParagraphDecorator(element.tagName, segmentFormat);
+        blockProcessor(group, element, context);
+    });
+    addBlock(group, createParagraph(true /*isImplicit*/, context.blockFormat));
+};
+//# sourceMappingURL=headingProcessor.js.map

package/lib-mjs/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,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC1D,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAO,EAAE,eAAe,EAAE,MAAM,yCAAyC,CAAC;AAC1E,OAAO,EAAE,wBAAwB,EAAE,MAAM,kDAAkD,CAAC;AAC5F,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD;;GAEG;AACH,MAAM,CAAC,IAAM,gBAAgB,GAAyC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IAC1F,WAAW,CACP,OAAO,EACP,EAAE,OAAO,EAAE,sBAAsB,EAAE,SAAS,EAAE,cAAc,EAAE,cAAc,EAAE,OAAO,EAAE,EACvF;QACI,IAAM,aAAa,GAA8B,EAAE,CAAC;QAEpD,WAAW,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,cAAc,EAAE,aAAa,EAAE,OAAO,CAAC,CAAC;QAEnF,OAAO,CAAC,cAAc,GAAG,wBAAwB,CAAC,OAAO,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC;QAElF,cAAc,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;IAC5C,CAAC,CACJ,CAAC;IAEF,QAAQ,CAAC,KAAK,EAAE,eAAe,CAAC,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC;AAC/E,CAAC,CAAC","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-mjs/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-mjs/domToModel/processors/hrProcessor.js

@@ -0,0 +1,23 @@
+import { addBlock } from '../../modelApi/common/addBlock';
+import { createDivider } from '../../modelApi/creators/createDivider';
+import { parseFormat } from '../utils/parseFormat';
+import { stackFormat } from '../utils/stackFormat';
+/**
+ * @internal
+ */
+export var hrProcessor = function (group, element, context) {
+    stackFormat(context, {
+        paragraph: 'shallowClone',
+    }, function () {
+        parseFormat(element, context.formatParsers.divider, context.blockFormat, context);
+        var hr = createDivider('hr', context.blockFormat);
+        if (element.size) {
+            hr.size = element.size;
+        }
+        if (context.isInSelection) {
+            hr.isSelected = true;
+        }
+        addBlock(group, hr);
+    });
+};
+//# sourceMappingURL=hrProcessor.js.map

package/lib-mjs/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,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AAEtE,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD;;GAEG;AACH,MAAM,CAAC,IAAM,WAAW,GAAoC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IAChF,WAAW,CACP,OAAO,EACP;QACI,SAAS,EAAE,cAAc;KAC5B,EACD;QACI,WAAW,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,OAAO,EAAE,OAAO,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC;QAElF,IAAM,EAAE,GAAG,aAAa,CAAC,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,QAAQ,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;IACxB,CAAC,CACJ,CAAC;AACN,CAAC,CAAC","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-mjs/domToModel/processors/imageProcessor.d.ts

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

package/lib-mjs/domToModel/processors/imageProcessor.js

@@ -0,0 +1,37 @@
+import { addDecorators } from '../../modelApi/common/addDecorators';
+import { addSegment } from '../../modelApi/common/addSegment';
+import { createImage } from '../../modelApi/creators/createImage';
+import { parseFormat } from '../utils/parseFormat';
+import { stackFormat } from '../utils/stackFormat';
+/**
+ * @internal
+ */
+export var imageProcessor = function (group, element, context) {
+    stackFormat(context, { segment: 'shallowClone' }, function () {
+        var _a;
+        var imageFormat = context.segmentFormat;
+        parseFormat(element, context.formatParsers.segment, imageFormat, context);
+        parseFormat(element, context.formatParsers.image, imageFormat, context);
+        parseFormat(element, context.formatParsers.block, context.blockFormat, context);
+        var image = createImage(element.src, imageFormat);
+        var alt = element.alt;
+        var title = element.title;
+        parseFormat(element, context.formatParsers.dataset, image.dataset, context);
+        addDecorators(image, context);
+        if (alt) {
+            image.alt = alt;
+        }
+        if (title) {
+            image.title = title;
+        }
+        if (context.isInSelection) {
+            image.isSelected = true;
+        }
+        if (((_a = context.imageSelection) === null || _a === void 0 ? void 0 : _a.image) == element) {
+            image.isSelectedAsImageSelection = true;
+            image.isSelected = true;
+        }
+        addSegment(group, image);
+    });
+};
+//# sourceMappingURL=imageProcessor.js.map

package/lib-mjs/domToModel/processors/imageProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"imageProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/imageProcessor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,qCAAqC,CAAC;AACpE,OAAO,EAAE,UAAU,EAAE,MAAM,kCAAkC,CAAC;AAE9D,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAClE,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD;;GAEG;AACH,MAAM,CAAC,IAAM,cAAc,GAAuC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IACtF,WAAW,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,cAAc,EAAE,EAAE;;QAC9C,IAAM,WAAW,GAA4B,OAAO,CAAC,aAAa,CAAC;QAEnE,WAAW,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,OAAO,EAAE,WAAW,EAAE,OAAO,CAAC,CAAC;QAC1E,WAAW,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,KAAK,EAAE,WAAW,EAAE,OAAO,CAAC,CAAC;QACxE,WAAW,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,KAAK,EAAE,OAAO,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC;QAEhF,IAAM,KAAK,GAAG,WAAW,CAAC,OAAO,CAAC,GAAG,EAAE,WAAW,CAAC,CAAC;QACpD,IAAM,GAAG,GAAG,OAAO,CAAC,GAAG,CAAC;QACxB,IAAM,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC;QAE5B,WAAW,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;QAC5E,aAAa,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;QAE9B,IAAI,GAAG,EAAE;YACL,KAAK,CAAC,GAAG,GAAG,GAAG,CAAC;SACnB;QACD,IAAI,KAAK,EAAE;YACP,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC;SACvB;QACD,IAAI,OAAO,CAAC,aAAa,EAAE;YACvB,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC;SAC3B;QACD,IAAI,CAAA,MAAA,OAAO,CAAC,cAAc,0CAAE,KAAK,KAAI,OAAO,EAAE;YAC1C,KAAK,CAAC,0BAA0B,GAAG,IAAI,CAAC;YACxC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC;SAC3B;QAED,UAAU,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;IAC7B,CAAC,CAAC,CAAC;AACP,CAAC,CAAC","sourcesContent":["import { addDecorators } from '../../modelApi/common/addDecorators';\nimport { addSegment } from '../../modelApi/common/addSegment';\nimport { ContentModelImageFormat, ElementProcessor } from 'roosterjs-content-model-types';\nimport { createImage } from '../../modelApi/creators/createImage';\nimport { parseFormat } from '../utils/parseFormat';\nimport { stackFormat } from '../utils/stackFormat';\n\n/**\n * @internal\n */\nexport const imageProcessor: ElementProcessor<HTMLImageElement> = (group, element, context) => {\n    stackFormat(context, { segment: 'shallowClone' }, () => {\n        const imageFormat: ContentModelImageFormat = context.segmentFormat;\n\n        parseFormat(element, context.formatParsers.segment, imageFormat, context);\n        parseFormat(element, context.formatParsers.image, imageFormat, context);\n        parseFormat(element, context.formatParsers.block, context.blockFormat, context);\n\n        const image = createImage(element.src, imageFormat);\n        const alt = element.alt;\n        const title = element.title;\n\n        parseFormat(element, context.formatParsers.dataset, image.dataset, context);\n        addDecorators(image, context);\n\n        if (alt) {\n            image.alt = alt;\n        }\n        if (title) {\n            image.title = title;\n        }\n        if (context.isInSelection) {\n            image.isSelected = true;\n        }\n        if (context.imageSelection?.image == element) {\n            image.isSelectedAsImageSelection = true;\n            image.isSelected = true;\n        }\n\n        addSegment(group, image);\n    });\n};\n"]}

package/lib-mjs/domToModel/processors/knownElementProcessor.d.ts

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

package/lib-mjs/domToModel/processors/knownElementProcessor.js

@@ -0,0 +1,92 @@
+import { addBlock } from '../../modelApi/common/addBlock';
+import { blockProcessor } from './blockProcessor';
+import { createParagraph } from '../../modelApi/creators/createParagraph';
+import { formatContainerProcessor } from './formatContainerProcessor';
+import { getDefaultStyle } from '../utils/getDefaultStyle';
+import { isBlockElement } from '../utils/isBlockElement';
+import { parseFormat } from '../utils/parseFormat';
+import { stackFormat } from '../utils/stackFormat';
+var FormatContainerTriggerStyles = [
+    'marginBottom',
+    'marginTop',
+    'paddingBottom',
+    'paddingTop',
+    'paddingLeft',
+    'paddingRight',
+    'borderTopWidth',
+    'borderBottomWidth',
+    'borderLeftWidth',
+    'borderRightWidth',
+    'width',
+    'height',
+    'maxWidth',
+    'maxHeight',
+    'minWidth',
+    'minHeight',
+];
+var ByPassFormatContainerTags = ['H1', 'H2', 'H3', 'H4', 'H5', 'H6', 'P', 'A'];
+var SegmentDecoratorTags = ['A', 'CODE'];
+/**
+ * @internal
+ */
+export var knownElementProcessor = function (group, element, context) {
+    var isBlock = isBlockElement(element, context);
+    if ((isBlock || element.style.display == 'inline-block') && // For inline-block here, we will also check if it should be represented as Format Container
+        shouldUseFormatContainer(element, context)) {
+        formatContainerProcessor(group, element, context);
+    }
+    else if (isBlock) {
+        var decorator = context.blockDecorator.tagName ? context.blockDecorator : undefined;
+        var isSegmentDecorator = SegmentDecoratorTags.indexOf(element.tagName) >= 0;
+        stackFormat(context, { segment: 'shallowCloneForBlock', paragraph: 'shallowClone' }, function () {
+            var segmentFormat = {};
+            parseFormat(element, context.formatParsers.segmentOnBlock, segmentFormat, context);
+            Object.assign(context.segmentFormat, segmentFormat);
+            blockProcessor(group, element, context, segmentFormat);
+        });
+        if (isBlock && !isSegmentDecorator) {
+            addBlock(group, createParagraph(true /*isImplicit*/, context.blockFormat, undefined /*segmentFormat*/, decorator));
+        }
+    }
+    else {
+        stackFormat(context, {
+            segment: 'shallowClone',
+            paragraph: 'shallowClone',
+            link: 'cloneFormat',
+        }, function () {
+            parseFormat(element, context.formatParsers.segment, context.segmentFormat, context);
+            if (context.link.format.href && element.tagName != 'A') {
+                parseFormat(element, context.formatParsers.segmentUnderLink, context.link.format, context);
+            }
+            context.elementProcessors.child(group, element, context);
+        });
+    }
+};
+function shouldUseFormatContainer(element, context) {
+    // For those tags that we know we should not use format container, just return false
+    if (ByPassFormatContainerTags.indexOf(element.tagName) >= 0) {
+        return false;
+    }
+    var style = element.style;
+    var defaultStyle = getDefaultStyle(element, context);
+    var bgcolor = style.getPropertyValue('background-color');
+    // For block element with background, we need to use format container
+    if (bgcolor && bgcolor != 'transparent') {
+        return true;
+    }
+    // For block element with positive value of border width or top/bottom margin/padding,
+    // we need to use format container
+    if (FormatContainerTriggerStyles.some(function (key) { return parseInt(style[key] || defaultStyle[key] || '') > 0; })) {
+        return true;
+    }
+    // For margin left/right with value "auto", we need to use format container
+    if (style.marginLeft == 'auto' || style.marginRight == 'auto') {
+        return true;
+    }
+    // For element with "align" attribute, we need to use format container
+    if (element.getAttribute('align')) {
+        return true;
+    }
+    return false;
+}
+//# sourceMappingURL=knownElementProcessor.js.map

package/lib-mjs/domToModel/processors/knownElementProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"knownElementProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/knownElementProcessor.ts"],"names":[],"mappings":"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","sourcesContent":["import { addBlock } from '../../modelApi/common/addBlock';\nimport { blockProcessor } from './blockProcessor';\nimport { createParagraph } from '../../modelApi/creators/createParagraph';\nimport { formatContainerProcessor } from './formatContainerProcessor';\nimport { getDefaultStyle } from '../utils/getDefaultStyle';\nimport { isBlockElement } from '../utils/isBlockElement';\nimport { parseFormat } from '../utils/parseFormat';\nimport { stackFormat } from '../utils/stackFormat';\nimport {\n    ContentModelSegmentFormat,\n    DomToModelContext,\n    ElementProcessor,\n} from 'roosterjs-content-model-types';\n\nconst FormatContainerTriggerStyles: (keyof CSSStyleDeclaration)[] = [\n    'marginBottom',\n    'marginTop',\n    'paddingBottom',\n    'paddingTop',\n    'paddingLeft',\n    'paddingRight',\n    'borderTopWidth',\n    'borderBottomWidth',\n    'borderLeftWidth',\n    'borderRightWidth',\n    'width',\n    'height',\n    'maxWidth',\n    'maxHeight',\n    'minWidth',\n    'minHeight',\n];\nconst ByPassFormatContainerTags = ['H1', 'H2', 'H3', 'H4', 'H5', 'H6', 'P', 'A'];\nconst SegmentDecoratorTags = ['A', 'CODE'];\n\n/**\n * @internal\n */\nexport const knownElementProcessor: ElementProcessor<HTMLElement> = (group, element, context) => {\n    const isBlock = isBlockElement(element, context);\n\n    if (\n        (isBlock || element.style.display == 'inline-block') && // For inline-block here, we will also check if it should be represented as Format Container\n        shouldUseFormatContainer(element, context)\n    ) {\n        formatContainerProcessor(group, element, context);\n    } else if (isBlock) {\n        const decorator = context.blockDecorator.tagName ? context.blockDecorator : undefined;\n        const isSegmentDecorator = SegmentDecoratorTags.indexOf(element.tagName) >= 0;\n\n        stackFormat(context, { segment: 'shallowCloneForBlock', paragraph: 'shallowClone' }, () => {\n            const segmentFormat: ContentModelSegmentFormat = {};\n\n            parseFormat(element, context.formatParsers.segmentOnBlock, segmentFormat, context);\n            Object.assign(context.segmentFormat, segmentFormat);\n\n            blockProcessor(group, element, context, segmentFormat);\n        });\n\n        if (isBlock && !isSegmentDecorator) {\n            addBlock(\n                group,\n                createParagraph(\n                    true /*isImplicit*/,\n                    context.blockFormat,\n                    undefined /*segmentFormat*/,\n                    decorator\n                )\n            );\n        }\n    } else {\n        stackFormat(\n            context,\n            {\n                segment: 'shallowClone',\n                paragraph: 'shallowClone',\n                link: 'cloneFormat',\n            },\n            () => {\n                parseFormat(element, context.formatParsers.segment, context.segmentFormat, context);\n\n                if (context.link.format.href && element.tagName != 'A') {\n                    parseFormat(\n                        element,\n                        context.formatParsers.segmentUnderLink,\n                        context.link.format,\n                        context\n                    );\n                }\n\n                context.elementProcessors.child(group, element, context);\n            }\n        );\n    }\n};\n\nfunction shouldUseFormatContainer(element: HTMLElement, context: DomToModelContext) {\n    // For those tags that we know we should not use format container, just return false\n    if (ByPassFormatContainerTags.indexOf(element.tagName) >= 0) {\n        return false;\n    }\n\n    const style = element.style;\n    const defaultStyle = getDefaultStyle(element, context);\n\n    const bgcolor = style.getPropertyValue('background-color');\n\n    // For block element with background, we need to use format container\n    if (bgcolor && bgcolor != 'transparent') {\n        return true;\n    }\n\n    // For block element with positive value of border width or top/bottom margin/padding,\n    // we need to use format container\n    if (\n        FormatContainerTriggerStyles.some(\n            key => parseInt((style[key] as string) || (defaultStyle[key] as string) || '') > 0\n        )\n    ) {\n        return true;\n    }\n\n    // For margin left/right with value \"auto\", we need to use format container\n    if (style.marginLeft == 'auto' || style.marginRight == 'auto') {\n        return true;\n    }\n\n    // For element with \"align\" attribute, we need to use format container\n    if (element.getAttribute('align')) {\n        return true;\n    }\n\n    return false;\n}\n"]}

package/lib-mjs/domToModel/processors/linkProcessor.d.ts

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

package/lib-mjs/domToModel/processors/linkProcessor.js

@@ -0,0 +1,20 @@
+import { knownElementProcessor } from './knownElementProcessor';
+import { parseFormat } from '../utils/parseFormat';
+import { stackFormat } from '../utils/stackFormat';
+/**
+ * @internal
+ */
+export var linkProcessor = function (group, element, context) {
+    if (element.hasAttribute('href')) {
+        stackFormat(context, { link: 'linkDefault' }, function () {
+            parseFormat(element, context.formatParsers.link, context.link.format, context);
+            parseFormat(element, context.formatParsers.dataset, context.link.dataset, context);
+            knownElementProcessor(group, element, context);
+        });
+    }
+    else {
+        // A tag without href, can be treated as normal SPAN tag
+        knownElementProcessor(group, element, context);
+    }
+};
+//# sourceMappingURL=linkProcessor.js.map

package/lib-mjs/domToModel/processors/linkProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"linkProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/linkProcessor.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD;;GAEG;AACH,MAAM,CAAC,IAAM,aAAa,GAAkC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IAChF,IAAI,OAAO,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE;QAC9B,WAAW,CAAC,OAAO,EAAE,EAAE,IAAI,EAAE,aAAa,EAAE,EAAE;YAC1C,WAAW,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,IAAI,EAAE,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;YAC/E,WAAW,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,OAAO,EAAE,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;YAEnF,qBAAqB,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;QACnD,CAAC,CAAC,CAAC;KACN;SAAM;QACH,wDAAwD;QACxD,qBAAqB,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;KAClD;AACL,CAAC,CAAC","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 linkProcessor: ElementProcessor<HTMLElement> = (group, element, context) => {\n    if (element.hasAttribute('href')) {\n        stackFormat(context, { link: 'linkDefault' }, () => {\n            parseFormat(element, context.formatParsers.link, context.link.format, context);\n            parseFormat(element, context.formatParsers.dataset, context.link.dataset, context);\n\n            knownElementProcessor(group, element, context);\n        });\n    } else {\n        // A tag without href, can be treated as normal SPAN tag\n        knownElementProcessor(group, element, context);\n    }\n};\n"]}

package/lib-mjs/domToModel/processors/listItemProcessor.d.ts

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

package/lib-mjs/domToModel/processors/listItemProcessor.js

@@ -0,0 +1,35 @@
+import { createListItem } from '../../modelApi/creators/createListItem';
+import { parseFormat } from '../utils/parseFormat';
+import { stackFormat } from '../utils/stackFormat';
+/**
+ * @internal
+ */
+export var listItemProcessor = function (group, element, context) {
+    var _a;
+    var listFormat = context.listFormat;
+    if (listFormat.listParent && listFormat.levels.length > 0) {
+        stackFormat(context, {
+            segment: 'shallowCloneForBlock',
+        }, function () {
+            parseFormat(element, context.formatParsers.segmentOnBlock, context.segmentFormat, context);
+            var listItem = createListItem(listFormat.levels, context.segmentFormat);
+            parseFormat(element, context.formatParsers.listItemElement, listItem.format, context);
+            listFormat.listParent.blocks.push(listItem);
+            parseFormat(element, context.formatParsers.listItem, listItem.levels[listItem.levels.length - 1], context);
+            context.elementProcessors.child(listItem, element, context);
+            var firstChild = listItem.blocks[0];
+            if (listItem.blocks.length == 1 &&
+                firstChild.blockType == 'Paragraph' &&
+                firstChild.isImplicit) {
+                Object.assign(listItem.format, firstChild.format);
+                firstChild.format = {};
+            }
+        });
+    }
+    else {
+        var currentBlocks = (_a = listFormat.listParent) === null || _a === void 0 ? void 0 : _a.blocks;
+        var lastItem = currentBlocks === null || currentBlocks === void 0 ? void 0 : currentBlocks[(currentBlocks === null || currentBlocks === void 0 ? void 0 : currentBlocks.length) - 1];
+        context.elementProcessors['*']((lastItem === null || lastItem === void 0 ? void 0 : lastItem.blockType) == 'BlockGroup' ? lastItem : group, element, context);
+    }
+};
+//# sourceMappingURL=listItemProcessor.js.map

package/lib-mjs/domToModel/processors/listItemProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"listItemProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/listItemProcessor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AAExE,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD;;GAEG;AACH,MAAM,CAAC,IAAM,iBAAiB,GAAoC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;;IAC9E,IAAA,UAAU,GAAK,OAAO,WAAZ,CAAa;IAE/B,IAAI,UAAU,CAAC,UAAU,IAAI,UAAU,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,EAAE;QACvD,WAAW,CACP,OAAO,EACP;YACI,OAAO,EAAE,sBAAsB;SAClC,EACD;YACI,WAAW,CACP,OAAO,EACP,OAAO,CAAC,aAAa,CAAC,cAAc,EACpC,OAAO,CAAC,aAAa,EACrB,OAAO,CACV,CAAC;YAEF,IAAM,QAAQ,GAAG,cAAc,CAAC,UAAU,CAAC,MAAM,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;YAC1E,WAAW,CACP,OAAO,EACP,OAAO,CAAC,aAAa,CAAC,eAAe,EACrC,QAAQ,CAAC,MAAM,EACf,OAAO,CACV,CAAC;YAEF,UAAU,CAAC,UAAW,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;YAE7C,WAAW,CACP,OAAO,EACP,OAAO,CAAC,aAAa,CAAC,QAAQ,EAC9B,QAAQ,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,EAC3C,OAAO,CACV,CAAC;YAEF,OAAO,CAAC,iBAAiB,CAAC,KAAK,CAAC,QAAQ,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;YAE5D,IAAM,UAAU,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;YAEtC,IACI,QAAQ,CAAC,MAAM,CAAC,MAAM,IAAI,CAAC;gBAC3B,UAAU,CAAC,SAAS,IAAI,WAAW;gBACnC,UAAU,CAAC,UAAU,EACvB;gBACE,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,EAAE,UAAU,CAAC,MAAM,CAAC,CAAC;gBAClD,UAAU,CAAC,MAAM,GAAG,EAAE,CAAC;aAC1B;QACL,CAAC,CACJ,CAAC;KACL;SAAM;QACH,IAAM,aAAa,GAAG,MAAA,UAAU,CAAC,UAAU,0CAAE,MAAM,CAAC;QACpD,IAAM,QAAQ,GAAG,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,CAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,MAAM,IAAG,CAAC,CAAC,CAAC;QAE5D,OAAO,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAC1B,CAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,SAAS,KAAI,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,EACtD,OAAO,EACP,OAAO,CACV,CAAC;KACL;AACL,CAAC,CAAC","sourcesContent":["import { createListItem } from '../../modelApi/creators/createListItem';\nimport { ElementProcessor } from 'roosterjs-content-model-types';\nimport { parseFormat } from '../utils/parseFormat';\nimport { stackFormat } from '../utils/stackFormat';\n\n/**\n * @internal\n */\nexport const listItemProcessor: ElementProcessor<HTMLLIElement> = (group, element, context) => {\n    const { listFormat } = context;\n\n    if (listFormat.listParent && listFormat.levels.length > 0) {\n        stackFormat(\n            context,\n            {\n                segment: 'shallowCloneForBlock',\n            },\n            () => {\n                parseFormat(\n                    element,\n                    context.formatParsers.segmentOnBlock,\n                    context.segmentFormat,\n                    context\n                );\n\n                const listItem = createListItem(listFormat.levels, context.segmentFormat);\n                parseFormat(\n                    element,\n                    context.formatParsers.listItemElement,\n                    listItem.format,\n                    context\n                );\n\n                listFormat.listParent!.blocks.push(listItem);\n\n                parseFormat(\n                    element,\n                    context.formatParsers.listItem,\n                    listItem.levels[listItem.levels.length - 1],\n                    context\n                );\n\n                context.elementProcessors.child(listItem, element, context);\n\n                const firstChild = listItem.blocks[0];\n\n                if (\n                    listItem.blocks.length == 1 &&\n                    firstChild.blockType == 'Paragraph' &&\n                    firstChild.isImplicit\n                ) {\n                    Object.assign(listItem.format, firstChild.format);\n                    firstChild.format = {};\n                }\n            }\n        );\n    } else {\n        const currentBlocks = listFormat.listParent?.blocks;\n        const lastItem = currentBlocks?.[currentBlocks?.length - 1];\n\n        context.elementProcessors['*'](\n            lastItem?.blockType == 'BlockGroup' ? lastItem : group,\n            element,\n            context\n        );\n    }\n};\n"]}

package/lib-mjs/domToModel/processors/listProcessor.d.ts

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

package/lib-mjs/domToModel/processors/listProcessor.js

@@ -0,0 +1,38 @@
+import { __assign } from "tslib";
+import { parseFormat } from '../utils/parseFormat';
+import { stackFormat } from '../utils/stackFormat';
+import { updateListMetadata } from '../../domUtils/metadata/updateListMetadata';
+/**
+ * @internal
+ */
+export var listProcessor = function (group, element, context) {
+    stackFormat(context, {
+        segment: 'shallowCloneForBlock',
+        paragraph: 'shallowCloneForGroup',
+    }, function () {
+        var level = __assign({}, context.blockFormat);
+        var listFormat = context.listFormat;
+        processMetadata(element, context, level);
+        parseFormat(element, context.formatParsers.listLevel, level, context);
+        parseFormat(element, context.formatParsers.segment, context.segmentFormat, context);
+        var originalListParent = listFormat.listParent;
+        listFormat.listParent = listFormat.listParent || group;
+        listFormat.levels.push(level);
+        try {
+            context.elementProcessors.child(group, element, context);
+        }
+        finally {
+            listFormat.levels.pop();
+            listFormat.listParent = originalListParent;
+        }
+    });
+};
+function processMetadata(element, context, level) {
+    var dataset = {};
+    parseFormat(element, context.formatParsers.dataset, dataset, context);
+    updateListMetadata({ dataset: dataset }, function (metadata) {
+        Object.assign(level, metadata || {});
+        return null;
+    });
+}
+//# sourceMappingURL=listProcessor.js.map

package/lib-mjs/domToModel/processors/listProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"listProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/listProcessor.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,4CAA4C,CAAC;AAQhF;;GAEG;AACH,MAAM,CAAC,IAAM,aAAa,GAA0D,UAChF,KAAK,EACL,OAAO,EACP,OAAO;IAEP,WAAW,CACP,OAAO,EACP;QACI,OAAO,EAAE,sBAAsB;QAC/B,SAAS,EAAE,sBAAsB;KACpC,EACD;QACI,IAAM,KAAK,gBAAyC,OAAO,CAAC,WAAW,CAAE,CAAC;QAClE,IAAA,UAAU,GAAK,OAAO,WAAZ,CAAa;QAE/B,eAAe,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC;QACzC,WAAW,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,SAAS,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;QACtE,WAAW,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,EAAE,OAAO,CAAC,CAAC;QAEpF,IAAM,kBAAkB,GAAG,UAAU,CAAC,UAAU,CAAC;QAEjD,UAAU,CAAC,UAAU,GAAG,UAAU,CAAC,UAAU,IAAI,KAAK,CAAC;QACvD,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAE9B,IAAI;YACA,OAAO,CAAC,iBAAiB,CAAC,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;SAC5D;gBAAS;YACN,UAAU,CAAC,MAAM,CAAC,GAAG,EAAE,CAAC;YACxB,UAAU,CAAC,UAAU,GAAG,kBAAkB,CAAC;SAC9C;IACL,CAAC,CACJ,CAAC;AACN,CAAC,CAAC;AAEF,SAAS,eAAe,CACpB,OAA4C,EAC5C,OAA0B,EAC1B,KAAsC;IAEtC,IAAM,OAAO,GAAkB,EAAE,CAAC;IAClC,WAAW,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;IACtE,kBAAkB,CAAC,EAAE,OAAO,SAAA,EAAE,EAAE,UAAA,QAAQ;QACpC,MAAM,CAAC,MAAM,CAAC,KAAK,EAAE,QAAQ,IAAI,EAAE,CAAC,CAAC;QACrC,OAAO,IAAI,CAAC;IAChB,CAAC,CAAC,CAAC;AACP,CAAC","sourcesContent":["import { parseFormat } from '../utils/parseFormat';\nimport { stackFormat } from '../utils/stackFormat';\nimport { updateListMetadata } from '../../domUtils/metadata/updateListMetadata';\nimport {\n    ContentModelListItemLevelFormat,\n    DatasetFormat,\n    DomToModelContext,\n    ElementProcessor,\n} from 'roosterjs-content-model-types';\n\n/**\n * @internal\n */\nexport const listProcessor: ElementProcessor<HTMLOListElement | HTMLUListElement> = (\n    group,\n    element,\n    context\n) => {\n    stackFormat(\n        context,\n        {\n            segment: 'shallowCloneForBlock',\n            paragraph: 'shallowCloneForGroup',\n        },\n        () => {\n            const level: ContentModelListItemLevelFormat = { ...context.blockFormat };\n            const { listFormat } = context;\n\n            processMetadata(element, context, level);\n            parseFormat(element, context.formatParsers.listLevel, level, context);\n            parseFormat(element, context.formatParsers.segment, context.segmentFormat, context);\n\n            const originalListParent = listFormat.listParent;\n\n            listFormat.listParent = listFormat.listParent || group;\n            listFormat.levels.push(level);\n\n            try {\n                context.elementProcessors.child(group, element, context);\n            } finally {\n                listFormat.levels.pop();\n                listFormat.listParent = originalListParent;\n            }\n        }\n    );\n};\n\nfunction processMetadata(\n    element: HTMLOListElement | HTMLUListElement,\n    context: DomToModelContext,\n    level: ContentModelListItemLevelFormat\n) {\n    const dataset: DatasetFormat = {};\n    parseFormat(element, context.formatParsers.dataset, dataset, context);\n    updateListMetadata({ dataset }, metadata => {\n        Object.assign(level, metadata || {});\n        return null;\n    });\n}\n"]}

package/lib-mjs/domToModel/processors/pProcessor.d.ts

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

package/lib-mjs/domToModel/processors/pProcessor.js

@@ -0,0 +1,20 @@
+import { addBlock } from '../../modelApi/common/addBlock';
+import { blockProcessor } from './blockProcessor';
+import { createParagraph } from '../../modelApi/creators/createParagraph';
+import { createParagraphDecorator } from '../../modelApi/creators/createParagraphDecorator';
+import { parseFormat } from '../utils/parseFormat';
+import { stackFormat } from '../utils/stackFormat';
+/**
+ * @internal
+ */
+export var pProcessor = function (group, element, context) {
+    stackFormat(context, { blockDecorator: 'empty', segment: 'shallowCloneForBlock', paragraph: 'shallowClone' }, function () {
+        context.blockDecorator = createParagraphDecorator(element.tagName);
+        var segmentFormat = {};
+        parseFormat(element, context.formatParsers.segmentOnBlock, segmentFormat, context);
+        Object.assign(context.segmentFormat, segmentFormat);
+        blockProcessor(group, element, context, segmentFormat);
+    });
+    addBlock(group, createParagraph(true /*isImplicit*/, context.blockFormat));
+};
+//# sourceMappingURL=pProcessor.js.map

package/lib-mjs/domToModel/processors/pProcessor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pProcessor.js","sourceRoot":"","sources":["../../../../../packages-content-model/roosterjs-content-model-dom/lib/domToModel/processors/pProcessor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC1D,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAO,EAAE,eAAe,EAAE,MAAM,yCAAyC,CAAC;AAC1E,OAAO,EAAE,wBAAwB,EAAE,MAAM,kDAAkD,CAAC;AAC5F,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAEnD;;GAEG;AACH,MAAM,CAAC,IAAM,UAAU,GAAkC,UAAC,KAAK,EAAE,OAAO,EAAE,OAAO;IAC7E,WAAW,CACP,OAAO,EACP,EAAE,cAAc,EAAE,OAAO,EAAE,OAAO,EAAE,sBAAsB,EAAE,SAAS,EAAE,cAAc,EAAE,EACvF;QACI,OAAO,CAAC,cAAc,GAAG,wBAAwB,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;QAEnE,IAAM,aAAa,GAA8B,EAAE,CAAC;QAEpD,WAAW,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,cAAc,EAAE,aAAa,EAAE,OAAO,CAAC,CAAC;QACnF,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,aAAa,EAAE,aAAa,CAAC,CAAC;QAEpD,cAAc,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,aAAa,CAAC,CAAC;IAC3D,CAAC,CACJ,CAAC;IAEF,QAAQ,CAAC,KAAK,EAAE,eAAe,CAAC,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC;AAC/E,CAAC,CAAC","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 pProcessor: ElementProcessor<HTMLElement> = (group, element, context) => {\n    stackFormat(\n        context,\n        { blockDecorator: 'empty', segment: 'shallowCloneForBlock', paragraph: 'shallowClone' },\n        () => {\n            context.blockDecorator = createParagraphDecorator(element.tagName);\n\n            const segmentFormat: ContentModelSegmentFormat = {};\n\n            parseFormat(element, context.formatParsers.segmentOnBlock, segmentFormat, context);\n            Object.assign(context.segmentFormat, segmentFormat);\n\n            blockProcessor(group, element, context, segmentFormat);\n        }\n    );\n\n    addBlock(group, createParagraph(true /*isImplicit*/, context.blockFormat));\n};\n"]}

package/lib-mjs/domToModel/processors/tableProcessor.d.ts

@@ -0,0 +1,19 @@
+import { ElementProcessor } from 'roosterjs-content-model-types';
+/**
+ * Content Model Element Processor for table
+ *
+ * For Table with merged/splitted cells, HTML uses colSpan and rowSpan attributes to specify how it should be rendered.
+ * To make it easier to edit a table, we will use a different way to describe table.
+ *
+ * 1. For a m * n table (m rows, n columns), we always create a m * n array for the cells.
+ * 2. For a regular table cell, it is mapped to one item of this array
+ * 3. For a merged/splitted table cell, it will has colSpan/rowSpan value. We also created TableCell model for those spanned
+ * cells, and use "spanLeft" and "spanAbove" to mark its state
+ * 4. When edit table, we always edit on this mapped m * n array because it always has an item for each cell
+ * 5. When write back to DOM, we create TD/TH elements for those non-spanned cells, and mark its colSpan/rowSpan value according
+ * its neighbour cell's spanLeft/spanAbove attribute
+ * @param group The parent block group
+ * @param parent Parent DOM node to process
+ * @param context DOM to Content Model context
+ */
+export declare const tableProcessor: ElementProcessor<HTMLTableElement>;

package/lib-mjs/domToModel/processors/tableProcessor.js

@@ -0,0 +1,160 @@
+import { __assign } from "tslib";
+import { addBlock } from '../../modelApi/common/addBlock';
+import { createTable } from '../../modelApi/creators/createTable';
+import { createTableCell } from '../../modelApi/creators/createTableCell';
+import { getBoundingClientRect } from '../utils/getBoundingClientRect';
+import { parseFormat } from '../utils/parseFormat';
+import { stackFormat } from '../utils/stackFormat';
+/**
+ * Content Model Element Processor for table
+ *
+ * For Table with merged/splitted cells, HTML uses colSpan and rowSpan attributes to specify how it should be rendered.
+ * To make it easier to edit a table, we will use a different way to describe table.
+ *
+ * 1. For a m * n table (m rows, n columns), we always create a m * n array for the cells.
+ * 2. For a regular table cell, it is mapped to one item of this array
+ * 3. For a merged/splitted table cell, it will has colSpan/rowSpan value. We also created TableCell model for those spanned
+ * cells, and use "spanLeft" and "spanAbove" to mark its state
+ * 4. When edit table, we always edit on this mapped m * n array because it always has an item for each cell
+ * 5. When write back to DOM, we create TD/TH elements for those non-spanned cells, and mark its colSpan/rowSpan value according
+ * its neighbour cell's spanLeft/spanAbove attribute
+ * @param group The parent block group
+ * @param parent Parent DOM node to process
+ * @param context DOM to Content Model context
+ */
+export var tableProcessor = function (group, tableElement, context) {
+    stackFormat(context, { segment: 'shallowCloneForBlock', paragraph: 'shallowCloneForGroup' }, function () {
+        parseFormat(tableElement, context.formatParsers.block, context.blockFormat, context);
+        var table = createTable(tableElement.rows.length, context.blockFormat);
+        var _a = context.tableSelection || {}, selectedTable = _a.table, firstCell = _a.firstCell, lastCell = _a.lastCell;
+        var hasTableSelection = selectedTable == tableElement && !!firstCell && !!lastCell;
+        if (context.allowCacheElement) {
+            table.cachedElement = tableElement;
+        }
+        parseFormat(tableElement, context.formatParsers.table, table.format, context);
+        parseFormat(tableElement, context.formatParsers.tableBorder, table.format, context);
+        parseFormat(tableElement, context.formatParsers.segmentOnBlock, context.segmentFormat, context);
+        parseFormat(tableElement, context.formatParsers.dataset, table.dataset, context);
+        addBlock(group, table);
+        var columnPositions = [0];
+        var rowPositions = [0];
+        var zoomScale = context.zoomScaleFormat.zoomScale || 1;
+        var _loop_1 = function (row) {
+            var tr = tableElement.rows[row];
+            var tableRow = table.rows[row];
+            if (context.allowCacheElement) {
+                tableRow.cachedElement = tr;
+            }
+            parseFormat(tr, context.formatParsers.tableRow, tableRow.format, context);
+            stackFormat(context, { paragraph: 'shallowClone', segment: 'shallowClone' }, function () {
+                var parent = tr.parentElement;
+                var parentTag = parent === null || parent === void 0 ? void 0 : parent.tagName;
+                if (parent &&
+                    (parentTag == 'TBODY' || parentTag == 'THEAD' || parentTag == 'TFOOT')) {
+                    // If there is TBODY around TR, retrieve format from TBODY first, in case some format are declared there
+                    parseFormat(parent, context.formatParsers.block, context.blockFormat, context);
+                    parseFormat(parent, context.formatParsers.segmentOnBlock, context.segmentFormat, context);
+                }
+                parseFormat(tr, context.formatParsers.block, context.blockFormat, context);
+                parseFormat(tr, context.formatParsers.segmentOnBlock, context.segmentFormat, context);
+                var _loop_2 = function (sourceCol, targetCol) {
+                    for (; tableRow.cells[targetCol]; targetCol++) { }
+                    var td = tr.cells[sourceCol];
+                    var hasSelectionBeforeCell = context.isInSelection;
+                    var colEnd = targetCol + td.colSpan;
+                    var rowEnd = row + td.rowSpan;
+                    var needCalcWidth = columnPositions[colEnd] === undefined;
+                    var needCalcHeight = rowPositions[rowEnd] === undefined;
+                    if (needCalcWidth || needCalcHeight) {
+                        var rect = getBoundingClientRect(td);
+                        if (rect.width > 0 || rect.height > 0) {
+                            if (needCalcWidth) {
+                                columnPositions[colEnd] =
+                                    columnPositions[targetCol] + rect.width / zoomScale;
+                            }
+                            if (needCalcHeight) {
+                                rowPositions[rowEnd] =
+                                    rowPositions[row] + rect.height / zoomScale;
+                            }
+                        }
+                    }
+                    stackFormat(context, { paragraph: 'shallowClone', segment: 'shallowClone' }, function () {
+                        parseFormat(td, context.formatParsers.block, context.blockFormat, context);
+                        parseFormat(td, context.formatParsers.segmentOnTableCell, context.segmentFormat, context);
+                        var cellFormat = __assign({}, context.blockFormat);
+                        var dataset = {};
+                        parseFormat(td, context.formatParsers.tableCell, cellFormat, context);
+                        parseFormat(td, context.formatParsers.tableBorder, cellFormat, context);
+                        parseFormat(td, context.formatParsers.dataset, dataset, context);
+                        for (var colSpan = 1; colSpan <= td.colSpan; colSpan++, targetCol++) {
+                            for (var rowSpan = 1; rowSpan <= td.rowSpan; rowSpan++) {
+                                var hasTd = colSpan == 1 && rowSpan == 1;
+                                var cell = createTableCell(colSpan > 1, rowSpan > 1, td.tagName == 'TH', cellFormat);
+                                cell.dataset = __assign({}, dataset);
+                                var spannedRow = table.rows[row + rowSpan - 1];
+                                if (spannedRow) {
+                                    spannedRow.cells[targetCol] = cell;
+                                }
+                                if (hasTd) {
+                                    if (context.allowCacheElement) {
+                                        cell.cachedElement = td;
+                                    }
+                                    var _a = context.listFormat, listParent = _a.listParent, levels = _a.levels;
+                                    context.listFormat.listParent = undefined;
+                                    context.listFormat.levels = [];
+                                    try {
+                                        context.elementProcessors.child(cell, td, context);
+                                    }
+                                    finally {
+                                        context.listFormat.listParent = listParent;
+                                        context.listFormat.levels = levels;
+                                    }
+                                }
+                                var hasSelectionAfterCell = context.isInSelection;
+                                if ((hasSelectionBeforeCell && hasSelectionAfterCell) ||
+                                    (hasTableSelection &&
+                                        row >= firstCell.y &&
+                                        row <= lastCell.y &&
+                                        targetCol >= firstCell.x &&
+                                        targetCol <= lastCell.x)) {
+                                    cell.isSelected = true;
+                                }
+                            }
+                        }
+                    });
+                    out_targetCol_1 = targetCol;
+                };
+                var out_targetCol_1;
+                for (var sourceCol = 0, targetCol = 0; sourceCol < tr.cells.length; sourceCol++) {
+                    _loop_2(sourceCol, targetCol);
+                    targetCol = out_targetCol_1;
+                }
+            });
+        };
+        for (var row = 0; row < tableElement.rows.length; row++) {
+            _loop_1(row);
+        }
+        table.widths = calcSizes(columnPositions);
+        var heights = calcSizes(rowPositions);
+        table.rows.forEach(function (row, i) {
+            if (heights[i] > 0) {
+                row.height = heights[i];
+            }
+        });
+    });
+};
+function calcSizes(positions) {
+    var result = [];
+    var lastPos = positions[positions.length - 1];
+    for (var i = positions.length - 2; i >= 0; i--) {
+        if (positions[i] === undefined) {
+            result[i] = 0;
+        }
+        else {
+            result[i] = lastPos - positions[i];
+            lastPos = positions[i];
+        }
+    }
+    return result;
+}
+//# sourceMappingURL=tableProcessor.js.map