@kedao/editor/lib/renderers/block/blockRendererFn.js

Rich Text Editor Based On Draft.js

import React from 'react';
import Image from '../atomics/Image';
import Video from '../atomics/Video';
import Audio from '../atomics/Audio';
import Embed from '../atomics/Embed';
import HorizontalLine from '../atomics/HorizontalLine';
import { getExtensionBlockRendererFns } from '../../helpers/extension';
class BlockRenderFnContext {
    constructor() {
        this.getRenderFn = (superProps, customBlockRendererFn) => {
            this.superProps = superProps;
            this.customBlockRendererFn = customBlockRendererFn;
            return this.blockRendererFn;
        };
        this.renderAtomicBlock = (props) => {
            const { superProps } = this;
            const entityKey = props.block.getEntityAt(0);
            if (!entityKey) {
                return null;
            }
            const entity = props.contentState.getEntity(entityKey);
            const mediaData = entity.getData();
            const mediaType = entity.getType();
            const mediaProps = Object.assign(Object.assign({}, superProps), { block: props.block, mediaData,
                entityKey });
            if (mediaType === 'IMAGE') {
                return React.createElement(Image, Object.assign({}, mediaProps));
            }
            if (mediaType === 'AUDIO') {
                return React.createElement(Audio, Object.assign({}, mediaProps));
            }
            if (mediaType === 'VIDEO') {
                return React.createElement(Video, Object.assign({}, mediaProps));
            }
            if (mediaType === 'EMBED') {
                return React.createElement(Embed, Object.assign({}, mediaProps));
            }
            if (mediaType === 'HR') {
                return React.createElement(HorizontalLine, Object.assign({}, mediaProps));
            }
            if (superProps.extendAtomics) {
                const atomics = superProps.extendAtomics;
                for (let i = 0; i < atomics.length; i++) {
                    if (mediaType === atomics[i].type) {
                        const Component = atomics[i].component;
                        return React.createElement(Component, Object.assign({}, mediaProps));
                    }
                }
            }
            return null;
        };
        this.blockRendererFn = (block) => {
            const { customBlockRendererFn, superProps } = this;
            const blockType = block.getType();
            let blockRenderer = null;
            if (customBlockRendererFn) {
                blockRenderer = customBlockRendererFn(block, superProps) || null;
            }
            if (blockRenderer) {
                return blockRenderer;
            }
            const extensionBlockRendererFns = getExtensionBlockRendererFns(superProps.editorId);
            extensionBlockRendererFns.find((item) => {
                if (item.blockType === blockType ||
                    (item.blockType instanceof RegExp && item.blockType.test(blockType))) {
                    blockRenderer = item.rendererFn ? item.rendererFn(superProps) : null;
                    return true;
                }
                return false;
            });
            if (blockRenderer) {
                return blockRenderer;
            }
            if (blockType === 'atomic') {
                blockRenderer = {
                    component: this.renderAtomicBlock,
                    editable: false
                };
            }
            return blockRenderer;
        };
    }
}
const blockRenderFnContext = new BlockRenderFnContext();
export default blockRenderFnContext.getRenderFn;
//# sourceMappingURL=blockRendererFn.js.map