customHTMLRenderer and plugin => No overload matches this call.

[JakubGIT]

Describe the bug

I tried to follow this tutorial:
https://github.com/nhn/tui.editor/blob/master/docs/en/custom-block.md
and this example:
https://nhn.github.io/tui.editor/latest/tutorial-example13-creating-plugin

but I get error error TS2769: No overload matches this call.

To Reproduce

import React from 'react';
import {Editor} from '@toast-ui/react-editor';
// Import language file
import '@toast-ui/editor/dist/i18n/de-de';
import '@toast-ui/editor/dist/toastui-editor.css';

const customHTMLRenderer = {
    htmlBlock: {
        iframe(node)
        {
            return [
                {type: 'openTag', tagName: 'iframe', outerNewLine: true, attributes: node.attrs},
                {type: 'html', content: node.childrenHTML},
                {type: 'closeTag', tagName: 'iframe', outerNewLine: true},
            ];
        },
    },
    htmlInline: {
        big(node, {entering})
        {
            return entering ?
                {type: 'openTag', tagName: 'big', attributes: node.attrs} :
                {type: 'closeTag', tagName: 'big'};
        },
    },
};

export const MyEditor = (reference: React.LegacyRef<Editor>, content: string): JSX.Element => (
    <Editor
        ref={reference}
        height="400px"
        initialEditType="markdown"
        initialValue={content}
        language="de"
        customHTMLRenderer={customHTMLRenderer}
        previewStyle="tab"
        // hideModeSwitch
        useCommandShortcut
    />
);

Expected behavior

to customize the parser

Screenshots

please see above

Desktop (please complete the following information):

• OS: Win10
• Browser Chrome
• Version:

 "dependencies": {
  "@microsoft/sp-core-library": "1.12.1",
  "@microsoft/sp-lodash-subset": "1.12.1",
  "@microsoft/sp-office-ui-fabric-core": "1.12.1",
  "@microsoft/sp-property-pane": "1.12.1",
  "@microsoft/sp-webpart-base": "1.12.1",
  "@toast-ui/editor": "^3.0.0",
  "@toast-ui/editor-plugin-color-syntax": "^3.0.0",
  "@toast-ui/react-editor": "^3.0.0",
  "@ts-stack/markdown": "^1.4.0",
  "office-ui-fabric-react": "7.156.0",
  "react": "16.9.0",
  "react-dom": "16.9.0",
  "react-markdown": "^4.3.1",
  "react-syntax-highlighter": "^15.4.3",
  "remarkable": "^2.0.1"
},
"devDependencies": {
  "@microsoft/rush-stack-compiler-4.2": "0.1.1",
  "@microsoft/sp-build-web": "1.12.1",
  "@microsoft/sp-module-interfaces": "1.12.1",
  "@microsoft/sp-webpart-workbench": "1.12.1",
  "@types/react": "16.9.36",
  "@types/react-dom": "16.9.8",
  "@types/remarkable": "^2.0.2",
  "@types/webpack-env": "1.13.1",
  "@typescript-eslint/eslint-plugin": "^4.27.0",
  "@typescript-eslint/parser": "^4.27.0",
  "ajv": "~5.2.2",
  "eslint": "^7.29.0",
  "eslint-plugin-jsx": "^0.1.0",
  "eslint-plugin-react": "^7.24.0",
  "gulp": "~4.0.2",
  "gulp-eslint": "^6.0.0",
  "typescript": "^4.3.4"
}

[js87zz]

@JakubGIT
Definitions of types of htmlBlock and htmlInline need to be modified. First of all, it would be better to ignore the type using @ts-ignore temporarily . I'll let you know here after the fixing it.
Thanks!

[JakubGIT]

ah ok, thanks for the reply!

[js87zz]

@JakubGIT
The bug has been fixed and released in v3.0.1.