@ckeditor/ckeditor5-html-support 0.0.0-internal-20241017.0

package/src/integrations/heading.js

@@ -0,0 +1,72 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module html-support/integrations/heading
+ */
+import { Plugin } from 'ckeditor5/src/core.js';
+import { Enter } from 'ckeditor5/src/enter.js';
+import DataSchema from '../dataschema.js';
+/**
+ * Provides the General HTML Support integration with {@link module:heading/heading~Heading Heading} feature.
+ */
+export default class HeadingElementSupport extends Plugin {
+    /**
+     * @inheritDoc
+     */
+    static get requires() {
+        return [DataSchema, Enter];
+    }
+    /**
+     * @inheritDoc
+     */
+    static get pluginName() {
+        return 'HeadingElementSupport';
+    }
+    /**
+     * @inheritDoc
+     */
+    static get isOfficialPlugin() {
+        return true;
+    }
+    /**
+     * @inheritDoc
+     */
+    init() {
+        const editor = this.editor;
+        if (!editor.plugins.has('HeadingEditing')) {
+            return;
+        }
+        const options = editor.config.get('heading.options');
+        this.registerHeadingElements(editor, options);
+    }
+    /**
+     * Registers all elements supported by HeadingEditing to enable custom attributes for those elements.
+     */
+    registerHeadingElements(editor, options) {
+        const dataSchema = editor.plugins.get(DataSchema);
+        const headerModels = [];
+        for (const option of options) {
+            if ('model' in option && 'view' in option) {
+                dataSchema.registerBlockElement({
+                    view: option.view,
+                    model: option.model
+                });
+                headerModels.push(option.model);
+            }
+        }
+        dataSchema.extendBlockElement({
+            model: 'htmlHgroup',
+            modelSchema: {
+                allowChildren: headerModels
+            }
+        });
+        dataSchema.extendBlockElement({
+            model: 'htmlSummary',
+            modelSchema: {
+                allowChildren: headerModels
+            }
+        });
+    }
+}

package/src/integrations/image.d.ts

@@ -0,0 +1,30 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module html-support/integrations/image
+ */
+import { Plugin } from 'ckeditor5/src/core.js';
+import DataFilter from '../datafilter.js';
+/**
+ * Provides the General HTML Support integration with the {@link module:image/image~Image Image} feature.
+ */
+export default class ImageElementSupport extends Plugin {
+    /**
+     * @inheritDoc
+     */
+    static get requires(): readonly [typeof DataFilter];
+    /**
+     * @inheritDoc
+     */
+    static get pluginName(): "ImageElementSupport";
+    /**
+     * @inheritDoc
+     */
+    static get isOfficialPlugin(): true;
+    /**
+     * @inheritDoc
+     */
+    init(): void;
+}

package/src/integrations/image.js

@@ -0,0 +1,195 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module html-support/integrations/image
+ */
+import { Plugin } from 'ckeditor5/src/core.js';
+import DataFilter from '../datafilter.js';
+import { setViewAttributes, updateViewAttributes } from '../utils.js';
+import { getDescendantElement } from './integrationutils.js';
+/**
+ * Provides the General HTML Support integration with the {@link module:image/image~Image Image} feature.
+ */
+export default class ImageElementSupport extends Plugin {
+    /**
+     * @inheritDoc
+     */
+    static get requires() {
+        return [DataFilter];
+    }
+    /**
+     * @inheritDoc
+     */
+    static get pluginName() {
+        return 'ImageElementSupport';
+    }
+    /**
+     * @inheritDoc
+     */
+    static get isOfficialPlugin() {
+        return true;
+    }
+    /**
+     * @inheritDoc
+     */
+    init() {
+        const editor = this.editor;
+        // At least one image plugin should be loaded for the integration to work properly.
+        if (!editor.plugins.has('ImageInlineEditing') && !editor.plugins.has('ImageBlockEditing')) {
+            return;
+        }
+        const schema = editor.model.schema;
+        const conversion = editor.conversion;
+        const dataFilter = editor.plugins.get(DataFilter);
+        dataFilter.on('register:figure', () => {
+            conversion.for('upcast').add(viewToModelFigureAttributeConverter(dataFilter));
+        });
+        dataFilter.on('register:img', (evt, definition) => {
+            if (definition.model !== 'imageBlock' && definition.model !== 'imageInline') {
+                return;
+            }
+            if (schema.isRegistered('imageBlock')) {
+                schema.extend('imageBlock', {
+                    allowAttributes: [
+                        'htmlImgAttributes',
+                        // Figure and Link don't have model counterpart.
+                        // We will preserve attributes on image model element using these attribute keys.
+                        'htmlFigureAttributes',
+                        'htmlLinkAttributes'
+                    ]
+                });
+            }
+            if (schema.isRegistered('imageInline')) {
+                schema.extend('imageInline', {
+                    allowAttributes: [
+                        // `htmlA` is needed for standard GHS link integration.
+                        'htmlA',
+                        'htmlImgAttributes'
+                    ]
+                });
+            }
+            conversion.for('upcast').add(viewToModelImageAttributeConverter(dataFilter));
+            conversion.for('downcast').add(modelToViewImageAttributeConverter());
+            if (editor.plugins.has('LinkImage')) {
+                conversion.for('upcast').add(viewToModelLinkImageAttributeConverter(dataFilter, editor));
+            }
+            evt.stop();
+        });
+    }
+}
+/**
+ * View-to-model conversion helper preserving allowed attributes on the {@link module:image/image~Image Image}
+ * feature model element.
+ *
+ * @returns Returns a conversion callback.
+ */
+function viewToModelImageAttributeConverter(dataFilter) {
+    return (dispatcher) => {
+        dispatcher.on('element:img', (evt, data, conversionApi) => {
+            if (!data.modelRange) {
+                return;
+            }
+            const viewImageElement = data.viewItem;
+            const viewAttributes = dataFilter.processViewAttributes(viewImageElement, conversionApi);
+            if (viewAttributes) {
+                conversionApi.writer.setAttribute('htmlImgAttributes', viewAttributes, data.modelRange);
+            }
+        }, { priority: 'low' });
+    };
+}
+/**
+ * View-to-model conversion helper preserving allowed attributes on {@link module:image/image~Image Image}
+ * feature model element from link view element.
+ *
+ * @returns Returns a conversion callback.
+ */
+function viewToModelLinkImageAttributeConverter(dataFilter, editor) {
+    const imageUtils = editor.plugins.get('ImageUtils');
+    return (dispatcher) => {
+        dispatcher.on('element:a', (evt, data, conversionApi) => {
+            const viewLink = data.viewItem;
+            const viewImage = imageUtils.findViewImgElement(viewLink);
+            if (!viewImage) {
+                return;
+            }
+            const modelImage = data.modelCursor.parent;
+            if (!modelImage.is('element', 'imageBlock')) {
+                return;
+            }
+            const viewAttributes = dataFilter.processViewAttributes(viewLink, conversionApi);
+            if (viewAttributes) {
+                conversionApi.writer.setAttribute('htmlLinkAttributes', viewAttributes, modelImage);
+            }
+        }, { priority: 'low' });
+    };
+}
+/**
+ * View-to-model conversion helper preserving allowed attributes on {@link module:image/image~Image Image}
+ * feature model element from figure view element.
+ *
+ * @returns Returns a conversion callback.
+ */
+function viewToModelFigureAttributeConverter(dataFilter) {
+    return (dispatcher) => {
+        dispatcher.on('element:figure', (evt, data, conversionApi) => {
+            const viewFigureElement = data.viewItem;
+            if (!data.modelRange || !viewFigureElement.hasClass('image')) {
+                return;
+            }
+            const viewAttributes = dataFilter.processViewAttributes(viewFigureElement, conversionApi);
+            if (viewAttributes) {
+                conversionApi.writer.setAttribute('htmlFigureAttributes', viewAttributes, data.modelRange);
+            }
+        }, { priority: 'low' });
+    };
+}
+/**
+ * A model-to-view conversion helper applying attributes from the {@link module:image/image~Image Image}
+ * feature.
+ * @returns Returns a conversion callback.
+ */
+function modelToViewImageAttributeConverter() {
+    return (dispatcher) => {
+        addInlineAttributeConversion('htmlImgAttributes');
+        addBlockAttributeConversion('img', 'htmlImgAttributes');
+        addBlockAttributeConversion('figure', 'htmlFigureAttributes');
+        addBlockAttributeConversion('a', 'htmlLinkAttributes');
+        function addInlineAttributeConversion(attributeName) {
+            dispatcher.on(`attribute:${attributeName}:imageInline`, (evt, data, conversionApi) => {
+                if (!conversionApi.consumable.consume(data.item, evt.name)) {
+                    return;
+                }
+                const { attributeOldValue, attributeNewValue } = data;
+                const viewElement = conversionApi.mapper.toViewElement(data.item);
+                updateViewAttributes(conversionApi.writer, attributeOldValue, attributeNewValue, viewElement);
+            }, { priority: 'low' });
+        }
+        function addBlockAttributeConversion(elementName, attributeName) {
+            dispatcher.on(`attribute:${attributeName}:imageBlock`, (evt, data, conversionApi) => {
+                if (!conversionApi.consumable.test(data.item, evt.name)) {
+                    return;
+                }
+                const { attributeOldValue, attributeNewValue } = data;
+                const containerElement = conversionApi.mapper.toViewElement(data.item);
+                const viewElement = getDescendantElement(conversionApi.writer, containerElement, elementName);
+                if (viewElement) {
+                    updateViewAttributes(conversionApi.writer, attributeOldValue, attributeNewValue, viewElement);
+                    conversionApi.consumable.consume(data.item, evt.name);
+                }
+            }, { priority: 'low' });
+            if (elementName === 'a') {
+                // To have a link element in the view, we need to attach a converter to the `linkHref` attribute as well.
+                dispatcher.on('attribute:linkHref:imageBlock', (evt, data, conversionApi) => {
+                    if (!conversionApi.consumable.consume(data.item, 'attribute:htmlLinkAttributes:imageBlock')) {
+                        return;
+                    }
+                    const containerElement = conversionApi.mapper.toViewElement(data.item);
+                    const viewElement = getDescendantElement(conversionApi.writer, containerElement, 'a');
+                    setViewAttributes(conversionApi.writer, data.item.getAttribute('htmlLinkAttributes'), viewElement);
+                }, { priority: 'low' });
+            }
+        }
+    };
+}

package/src/integrations/integrationutils.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+import type { DowncastWriter, ViewElement } from 'ckeditor5/src/engine.js';
+/**
+ * @module html-support/integrations/integrationutils
+ */
+/**
+ * Returns the first view element descendant matching the given view name.
+ * Includes view element itself.
+ *
+ * @internal
+ */
+export declare function getDescendantElement(writer: DowncastWriter, containerElement: ViewElement, elementName: string): ViewElement | undefined;

package/src/integrations/integrationutils.js

@@ -0,0 +1,21 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module html-support/integrations/integrationutils
+ */
+/**
+ * Returns the first view element descendant matching the given view name.
+ * Includes view element itself.
+ *
+ * @internal
+ */
+export function getDescendantElement(writer, containerElement, elementName) {
+    const range = writer.createRangeOn(containerElement);
+    for (const { item } of range.getWalker()) {
+        if (item.is('element', elementName)) {
+            return item;
+        }
+    }
+}

package/src/integrations/list.d.ts

@@ -0,0 +1,31 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+import { Plugin } from 'ckeditor5/src/core.js';
+import DataFilter from '../datafilter.js';
+/**
+ * Provides the General HTML Support integration with the {@link module:list/list~List List} feature.
+ */
+export default class ListElementSupport extends Plugin {
+    /**
+     * @inheritDoc
+     */
+    static get requires(): readonly [typeof DataFilter];
+    /**
+     * @inheritDoc
+     */
+    static get pluginName(): "ListElementSupport";
+    /**
+     * @inheritDoc
+     */
+    static get isOfficialPlugin(): true;
+    /**
+     * @inheritDoc
+     */
+    init(): void;
+    /**
+     * @inheritDoc
+     */
+    afterInit(): void;
+}

package/src/integrations/list.js

@@ -0,0 +1,185 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module html-support/integrations/list
+ */
+import { isEqual } from 'lodash-es';
+import { Plugin } from 'ckeditor5/src/core.js';
+import { getHtmlAttributeName, setViewAttributes } from '../utils.js';
+import DataFilter from '../datafilter.js';
+/**
+ * Provides the General HTML Support integration with the {@link module:list/list~List List} feature.
+ */
+export default class ListElementSupport extends Plugin {
+    /**
+     * @inheritDoc
+     */
+    static get requires() {
+        return [DataFilter];
+    }
+    /**
+     * @inheritDoc
+     */
+    static get pluginName() {
+        return 'ListElementSupport';
+    }
+    /**
+     * @inheritDoc
+     */
+    static get isOfficialPlugin() {
+        return true;
+    }
+    /**
+     * @inheritDoc
+     */
+    init() {
+        const editor = this.editor;
+        if (!editor.plugins.has('ListEditing')) {
+            return;
+        }
+        const schema = editor.model.schema;
+        const conversion = editor.conversion;
+        const dataFilter = editor.plugins.get(DataFilter);
+        const listEditing = editor.plugins.get('ListEditing');
+        const listUtils = editor.plugins.get('ListUtils');
+        const viewElements = ['ul', 'ol', 'li'];
+        // Register downcast strategy.
+        // Note that this must be done before document list editing registers conversion in afterInit.
+        listEditing.registerDowncastStrategy({
+            scope: 'item',
+            attributeName: 'htmlLiAttributes',
+            setAttributeOnDowncast: setViewAttributes
+        });
+        listEditing.registerDowncastStrategy({
+            scope: 'list',
+            attributeName: 'htmlUlAttributes',
+            setAttributeOnDowncast: setViewAttributes
+        });
+        listEditing.registerDowncastStrategy({
+            scope: 'list',
+            attributeName: 'htmlOlAttributes',
+            setAttributeOnDowncast: setViewAttributes
+        });
+        dataFilter.on('register', (evt, definition) => {
+            if (!viewElements.includes(definition.view)) {
+                return;
+            }
+            evt.stop();
+            // Do not register same converters twice.
+            if (schema.checkAttribute('$block', 'htmlLiAttributes')) {
+                return;
+            }
+            const allowAttributes = viewElements.map(element => getHtmlAttributeName(element));
+            schema.extend('$listItem', { allowAttributes });
+            conversion.for('upcast').add(dispatcher => {
+                dispatcher.on('element:ul', viewToModelListAttributeConverter('htmlUlAttributes', dataFilter), { priority: 'low' });
+                dispatcher.on('element:ol', viewToModelListAttributeConverter('htmlOlAttributes', dataFilter), { priority: 'low' });
+                dispatcher.on('element:li', viewToModelListAttributeConverter('htmlLiAttributes', dataFilter), { priority: 'low' });
+            });
+        });
+        // Make sure that all items in a single list (items at the same level & listType) have the same properties.
+        listEditing.on('postFixer', (evt, { listNodes, writer }) => {
+            for (const { node, previousNodeInList } of listNodes) {
+                // This is a first item of a nested list.
+                if (!previousNodeInList) {
+                    continue;
+                }
+                if (previousNodeInList.getAttribute('listType') == node.getAttribute('listType')) {
+                    const attribute = getAttributeFromListType(previousNodeInList.getAttribute('listType'));
+                    const value = previousNodeInList.getAttribute(attribute);
+                    if (!isEqual(node.getAttribute(attribute), value) &&
+                        writer.model.schema.checkAttribute(node, attribute)) {
+                        writer.setAttribute(attribute, value, node);
+                        evt.return = true;
+                    }
+                }
+                if (previousNodeInList.getAttribute('listItemId') == node.getAttribute('listItemId')) {
+                    const value = previousNodeInList.getAttribute('htmlLiAttributes');
+                    if (!isEqual(node.getAttribute('htmlLiAttributes'), value) &&
+                        writer.model.schema.checkAttribute(node, 'htmlLiAttributes')) {
+                        writer.setAttribute('htmlLiAttributes', value, node);
+                        evt.return = true;
+                    }
+                }
+            }
+        });
+        // Remove `ol` attributes from `ul` elements and vice versa.
+        listEditing.on('postFixer', (evt, { listNodes, writer }) => {
+            for (const { node } of listNodes) {
+                const listType = node.getAttribute('listType');
+                if (!listUtils.isNumberedListType(listType) && node.getAttribute('htmlOlAttributes')) {
+                    writer.removeAttribute('htmlOlAttributes', node);
+                    evt.return = true;
+                }
+                if (listUtils.isNumberedListType(listType) && node.getAttribute('htmlUlAttributes')) {
+                    writer.removeAttribute('htmlUlAttributes', node);
+                    evt.return = true;
+                }
+            }
+        });
+    }
+    /**
+     * @inheritDoc
+     */
+    afterInit() {
+        const editor = this.editor;
+        if (!editor.commands.get('indentList')) {
+            return;
+        }
+        // Reset list attributes after indenting list items.
+        const indentList = editor.commands.get('indentList');
+        this.listenTo(indentList, 'afterExecute', (evt, changedBlocks) => {
+            editor.model.change(writer => {
+                for (const node of changedBlocks) {
+                    const attribute = getAttributeFromListType(node.getAttribute('listType'));
+                    if (!editor.model.schema.checkAttribute(node, attribute)) {
+                        continue;
+                    }
+                    // Just reset the attribute.
+                    // If there is a previous indented list that this node should be merged into,
+                    // the postfixer will unify all the attributes of both sub-lists.
+                    writer.setAttribute(attribute, {}, node);
+                }
+            });
+        });
+    }
+}
+/**
+ * View-to-model conversion helper preserving allowed attributes on {@link TODO}
+ * feature model element.
+ *
+ * @returns Returns a conversion callback.
+ */
+function viewToModelListAttributeConverter(attributeName, dataFilter) {
+    return (evt, data, conversionApi) => {
+        const viewElement = data.viewItem;
+        if (!data.modelRange) {
+            Object.assign(data, conversionApi.convertChildren(data.viewItem, data.modelCursor));
+        }
+        const viewAttributes = dataFilter.processViewAttributes(viewElement, conversionApi);
+        for (const item of data.modelRange.getItems({ shallow: true })) {
+            // Apply only to list item blocks.
+            if (!item.hasAttribute('listItemId')) {
+                continue;
+            }
+            // Set list attributes only on same level items, those nested deeper are already handled
+            // by the recursive conversion.
+            if (item.hasAttribute('htmlUlAttributes') || item.hasAttribute('htmlOlAttributes')) {
+                continue;
+            }
+            if (conversionApi.writer.model.schema.checkAttribute(item, attributeName)) {
+                conversionApi.writer.setAttribute(attributeName, viewAttributes || {}, item);
+            }
+        }
+    };
+}
+/**
+ * Returns HTML attribute name based on provided list type.
+ */
+function getAttributeFromListType(listType) {
+    return listType === 'numbered' || listType == 'customNumbered' ?
+        'htmlOlAttributes' :
+        'htmlUlAttributes';
+}

package/src/integrations/mediaembed.d.ts

@@ -0,0 +1,30 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module html-support/integrations/mediaembed
+ */
+import { Plugin } from 'ckeditor5/src/core.js';
+import DataFilter from '../datafilter.js';
+/**
+ * Provides the General HTML Support integration with {@link module:media-embed/mediaembed~MediaEmbed Media Embed} feature.
+ */
+export default class MediaEmbedElementSupport extends Plugin {
+    /**
+     * @inheritDoc
+     */
+    static get requires(): readonly [typeof DataFilter];
+    /**
+     * @inheritDoc
+     */
+    static get pluginName(): "MediaEmbedElementSupport";
+    /**
+     * @inheritDoc
+     */
+    static get isOfficialPlugin(): true;
+    /**
+     * @inheritDoc
+     */
+    init(): void;
+}