diff --git a/packages/rich-text-html-renderer/README.md b/packages/rich-text-html-renderer/README.md index 30cc556c..fc0bd718 100644 --- a/packages/rich-text-html-renderer/README.md +++ b/packages/rich-text-html-renderer/README.md @@ -177,6 +177,7 @@ The `renderMark` keys should be one of the following `MARKS` properties as defin - `CODE` - `SUPERSCRIPT` - `SUBSCRIPT` +- `STRIKETHROUGH` #### Preserving Whitespace diff --git a/packages/rich-text-html-renderer/src/__test__/index.test.ts b/packages/rich-text-html-renderer/src/__test__/index.test.ts index 81e03a88..2f4419e6 100644 --- a/packages/rich-text-html-renderer/src/__test__/index.test.ts +++ b/packages/rich-text-html-renderer/src/__test__/index.test.ts @@ -93,6 +93,10 @@ describe('documentToHtmlString', () => { doc: marksDoc(MARKS.SUBSCRIPT), expected: '

hello world

', }, + { + doc: marksDoc(MARKS.STRIKETHROUGH), + expected: '

hello world

', + }, ]; docs.forEach(({ doc, expected }) => { diff --git a/packages/rich-text-html-renderer/src/index.ts b/packages/rich-text-html-renderer/src/index.ts index 4a132a07..ccbe1018 100644 --- a/packages/rich-text-html-renderer/src/index.ts +++ b/packages/rich-text-html-renderer/src/index.ts @@ -52,6 +52,7 @@ const defaultMarkRenderers: RenderMark = { [MARKS.CODE]: (text) => `${text}`, [MARKS.SUPERSCRIPT]: (text) => `${text}`, [MARKS.SUBSCRIPT]: (text) => `${text}`, + [MARKS.STRIKETHROUGH]: (text) => `${text}`, }; const defaultInline = (type: string, node: Inline) => diff --git a/packages/rich-text-react-renderer/src/__test__/__snapshots__/index.test.tsx.snap b/packages/rich-text-react-renderer/src/__test__/__snapshots__/index.test.tsx.snap index 538b6cc5..4dcf4de3 100644 --- a/packages/rich-text-react-renderer/src/__test__/__snapshots__/index.test.tsx.snap +++ b/packages/rich-text-react-renderer/src/__test__/__snapshots__/index.test.tsx.snap @@ -185,6 +185,16 @@ exports[`documentToReactComponents renders marks with default mark renderer 6`] ] `; +exports[`documentToReactComponents renders marks with default mark renderer 7`] = ` +[ +

+ + hello world + +

, +] +`; + exports[`documentToReactComponents renders marks with the passed custom mark renderer 1`] = ` [

diff --git a/packages/rich-text-react-renderer/src/__test__/index.test.tsx b/packages/rich-text-react-renderer/src/__test__/index.test.tsx index 5bf65297..7a5ffaf9 100644 --- a/packages/rich-text-react-renderer/src/__test__/index.test.tsx +++ b/packages/rich-text-react-renderer/src/__test__/index.test.tsx @@ -69,6 +69,7 @@ describe('documentToReactComponents', () => { marksDoc(MARKS.CODE), marksDoc(MARKS.SUPERSCRIPT), marksDoc(MARKS.SUBSCRIPT), + marksDoc(MARKS.STRIKETHROUGH), ]; docs.forEach((doc) => { diff --git a/packages/rich-text-react-renderer/src/index.tsx b/packages/rich-text-react-renderer/src/index.tsx index 33093054..6f54fb31 100644 --- a/packages/rich-text-react-renderer/src/index.tsx +++ b/packages/rich-text-react-renderer/src/index.tsx @@ -43,6 +43,7 @@ const defaultMarkRenderers: RenderMark = { [MARKS.CODE]: (text) => {text}, [MARKS.SUPERSCRIPT]: (text) => {text}, [MARKS.SUBSCRIPT]: (text) => {text}, + [MARKS.STRIKETHROUGH]: (text) => {text}, }; function defaultInline(type: string, node: Inline): ReactNode { diff --git a/packages/rich-text-types/src/marks.ts b/packages/rich-text-types/src/marks.ts index 80f193e3..535c85f4 100644 --- a/packages/rich-text-types/src/marks.ts +++ b/packages/rich-text-types/src/marks.ts @@ -8,4 +8,5 @@ export enum MARKS { CODE = 'code', SUPERSCRIPT = 'superscript', SUBSCRIPT = 'subscript', + STRIKETHROUGH = 'strikethrough', }