fix: wrong custom renderer type definition (nhn#1640)

* chore: change custom renderer type def for toastmark * chore: change custom renderer option type for editor * fix: apply changed type to plugin, editor
ahamelers · Jul 6, 2021 · 1473167 · 1473167
1 parent d72539d
commit 1473167
Show file tree

Hide file tree

Showing 5 changed files with 37 additions and 18 deletions.
diff --git a/src/markdown/htmlRenderConvertors.ts b/src/markdown/htmlRenderConvertors.ts
@@ -1,3 +1,4 @@
+import isFunction from 'tui-code-snippet/type/isFunction';
 import {
   HTMLConvertorMap,
   MdNode,
@@ -7,8 +8,9 @@ import {
   CustomInlineMdNode,
   OpenTagToken,
   Context,
-} from '@toast-ui/toastmark';
-import { LinkAttributes } from '@t/editor';
+  HTMLConvertor,
+} from '@t/toastmark';
+import { LinkAttributes, CustomHTMLRenderer } from '@t/editor';
 import { HTMLMdNode } from '@t/markdown';
 import { reHTMLTag } from '@/convertors/toWysiwyg/htmlToWwConvertors';
 import { getWidgetContent, widgetToDOM } from '@/widget/rules';
@@ -125,7 +127,7 @@ const baseConvertors: HTMLConvertorMap = {
 
 export function getHTMLRenderConvertors(
   linkAttributes: LinkAttributes | null,
-  customConvertors: HTMLConvertorMap
+  customConvertors: CustomHTMLRenderer
 ) {
   const convertors = { ...baseConvertors };
 
@@ -148,22 +150,21 @@ export function getHTMLRenderConvertors(
       const orgConvertor = convertors[nodeType];
       const customConvertor = customConvertors[nodeType]!;
 
-      if (orgConvertor) {
+      if (orgConvertor && isFunction(customConvertor)) {
         convertors[nodeType] = (node, context) => {
           const newContext = { ...context };
 
           newContext.origin = () => orgConvertor(node, context);
           return customConvertor(node, newContext);
         };
-      } else if (includes(['htmlBlock', 'htmlInline'], nodeType)) {
+      } else if (includes(['htmlBlock', 'htmlInline'], nodeType) && !isFunction(customConvertor)) {
         convertors[nodeType] = (node, context) => {
           const matched = node.literal!.match(reHTMLTag);
 
           if (matched) {
             const [rootHTML, openTagName, , closeTagName] = matched;
             const typeName = (openTagName || closeTagName).toLowerCase();
-            // @ts-expect-error
-            const htmlConvertor: CustomHTMLRenderer = customConvertor[typeName];
+            const htmlConvertor = customConvertor[typeName];
             const childrenHTML = getChildrenHTML(node, typeName);
 
             if (htmlConvertor) {
@@ -181,7 +182,7 @@ export function getHTMLRenderConvertors(
           return context.origin!();
         };
       } else {
-        convertors[nodeType] = customConvertor;
+        convertors[nodeType] = customConvertor as HTMLConvertor;
       }
     });
   }

diff --git a/types/editor.d.ts b/types/editor.d.ts
@@ -1,12 +1,13 @@
 import { Schema, NodeSpec, MarkSpec, Fragment } from 'prosemirror-model';
 import { EditorView, Decoration, DecorationSet } from 'prosemirror-view';
 import { EditorState, Plugin, Selection, TextSelection } from 'prosemirror-state';
-import { HTMLConvertorMap, MdPos, Sourcepos } from './toastmark';
+import { HTMLConvertor, MdPos, Sourcepos, Context as MdContext } from './toastmark';
 import { Emitter, Handler } from './event';
 import { Context, EditorAllCommandMap, EditorCommandFn, SpecManager } from './spec';
 import { ToMdConvertorMap } from './convertor';
 import { ToolbarItemOptions, IndexList } from './ui';
 import { CommandFn, PluginInfo } from './plugin';
+import { HTMLMdNode } from './markdown';
 
 export type PreviewStyle = 'tab' | 'vertical';
 export type EditorType = 'markdown' | 'wysiwyg';
@@ -53,14 +54,24 @@ export type LinkAttributes = Partial<Record<LinkAttributeNames, string>>;
 
 export type Sanitizer = (content: string) => string;
 
+export type HTMLMdNodeConvertor = (
+  node: HTMLMdNode,
+  context: MdContext,
+  convertors?: HTMLConvertorMap
+) => HTMLToken | HTMLToken[] | null;
+
+export type HTMLMdNodeConvertorMap = Record<string, HTMLMdNodeConvertor>;
+
+export type CustomHTMLRenderer = Partial<Record<string, HTMLConvertor | HTMLMdNodeConvertorMap>>;
+
 export interface ViewerOptions {
   el: HTMLElement;
   initialValue?: string;
   events?: EventMap;
   plugins?: EditorPlugin[];
   extendedAutolinks?: ExtendedAutolinks;
   linkAttributes?: LinkAttributes;
-  customHTMLRenderer?: HTMLConvertorMap;
+  customHTMLRenderer?: CustomHTMLRenderer;
   referenceDefinition?: boolean;
   customHTMLSanitizer?: Sanitizer;
   frontMatter?: boolean;
@@ -132,7 +143,7 @@ export interface EditorOptions {
   extendedAutolinks?: ExtendedAutolinks;
   placeholder?: string;
   linkAttributes?: LinkAttributes;
-  customHTMLRenderer?: HTMLConvertorMap;
+  customHTMLRenderer?: CustomHTMLRenderer;
   customMarkdownRenderer?: ToMdConvertorMap;
   referenceDefinition?: boolean;
   customHTMLSanitizer?: Sanitizer;

diff --git a/types/index.d.ts b/types/index.d.ts
@@ -18,6 +18,9 @@ import {
   WidgetRule,
   PluginContext,
   I18n,
+  CustomHTMLRenderer,
+  HTMLMdNodeConvertor,
+  HTMLMdNodeConvertorMap,
 } from './editor';
 
 export {
@@ -32,7 +35,7 @@ export {
   ListData,
   HeadingMdNode,
   CodeMdNode,
-  HTMLConvertorMap as ToHTMLConvertorMap,
+  HTMLConvertorMap,
 } from './toastmark';
 export { ToMdConvertorMap } from './convertor';
 export { Emitter, Handler } from './event';
@@ -51,10 +54,13 @@ export {
   WidgetRule,
   PluginContext,
   I18n,
+  CustomHTMLRenderer,
+  HTMLMdNodeConvertor,
+  HTMLMdNodeConvertorMap,
 };
 export { Dispatch } from './spec';
 export { PluginInfo, PluginNodeViews, CommandFn, PluginCommandMap } from './plugin';
-export { MdLikeNode } from './markdown';
+export { MdLikeNode, HTMLMdNode } from './markdown';
 export { Editor, EditorCore };
 export default Editor;
 

diff --git a/types/plugin.d.ts b/types/plugin.d.ts
@@ -2,7 +2,8 @@ import { Plugin, EditorState } from 'prosemirror-state';
 import { EditorView, NodeView } from 'prosemirror-view';
 import { Node } from 'prosemirror-model';
 
-import { HTMLConvertorMap, CustomParserMap } from './toastmark';
+import { CustomParserMap } from './toastmark';
+import { CustomHTMLRendererOpt } from './editor';
 import { Emitter } from './event';
 import { ToMdConvertorMap } from './convertor';
 import { Dispatch, Payload, DefaultPayload } from './spec';
@@ -34,7 +35,7 @@ interface PluginToolbarItem {
 }
 
 export interface PluginInfo {
-  toHTMLRenderers?: HTMLConvertorMap;
+  toHTMLRenderers?: CustomHTMLRendererOpt;
   toMarkdownRenderers?: ToMdConvertorMap;
   markdownPlugins?: PluginProp[];
   wysiwygPlugins?: PluginProp[];
@@ -46,7 +47,7 @@ export interface PluginInfo {
 }
 
 export interface PluginInfoResult {
-  toHTMLRenderers: HTMLConvertorMap;
+  toHTMLRenderers: CustomHTMLRendererOpt;
   toMarkdownRenderers: ToMdConvertorMap;
   mdPlugins: PluginProp[];
   wwPlugins: PluginProp[];

diff --git a/types/toastmark.d.ts b/types/toastmark.d.ts
@@ -255,7 +255,7 @@ export type HTMLConvertor = (
   convertors?: HTMLConvertorMap
 ) => HTMLToken | HTMLToken[] | null;
 
-export type HTMLConvertorMap = Partial<Record<MdNodeType | string, HTMLConvertor>>;
+export type HTMLConvertorMap = Partial<Record<string, HTMLConvertor>>;
 
 interface RendererOptions {
   gfm: boolean;
@@ -283,7 +283,7 @@ interface TagToken {
 export interface OpenTagToken extends TagToken {
   type: 'openTag';
   classNames?: string[];
-  attributes?: Record<string, string>;
+  attributes?: Record<string, any>;
   selfClose?: boolean;
 }