feat: parse strong and em label

Author: yanglbme

src/config/theme.ts

@@ -157,6 +157,11 @@ const defaultTheme: Theme = {
       // 'word-break': `break-all`,
     },
 
+    em: {
+      'font-style': `italic`,
+      'font-size': `inherit`,
+    },
+
     link: {
       color: `#576b95`,
     },
@@ -297,6 +302,9 @@ const graceTheme = toMerged(defaultTheme, {
     codespan: {
     },
 
+    em: {
+    },
+
     link: {
     },
 

src/types/index.ts

@@ -1,7 +1,7 @@
 import type { PropertiesHyphen } from 'csstype'
 
 type Block = `h1` | `h2` | `h3` | `h4` | `p` | `blockquote` | `blockquote_p` | `code_pre` | `code` | `image` | `ol` | `ul` | `footnotes` | `figure` | `hr`
-type Inline = `listitem` | `codespan` | `link` | `wx_link` | `strong` | `table` | `thead` | `td` | `footnote` | `figcaption`
+type Inline = `listitem` | `codespan` | `link` | `wx_link` | `strong` | `table` | `thead` | `td` | `footnote` | `figcaption` | `em`
 
 interface CustomCSSProperties {
   [`--md-primary-color`]?: string

src/utils/renderer.ts

@@ -222,12 +222,12 @@ export function initRenderer(opts: IOpts) {
       return styledContent(`link`, text, `span`)
     },
 
-    strong({ text }: Tokens.Strong): string {
-      return styledContent(`strong`, text)
+    strong( {tokens}: Tokens.Strong): string {
+      return styledContent(`strong`, this.parser.parseInline(tokens))
     },
 
-    em({ text }: Tokens.Em): string {
-      return `<span style="font-style: italic;">${text}</span>`
+    em({ tokens }: Tokens.Em): string {
+      return styledContent(`em`, this.parser.parseInline(tokens), `span`)
     },
 
     table({ header, rows }: Tokens.Table): string {