From 138b08fabe54d434f6f9174f3b11436aa988b9a9 Mon Sep 17 00:00:00 2001
From: Jimmy Mabey <jimmymabey@gmail.com>
Date: Tue, 15 Dec 2020 15:38:49 -0400
Subject: [PATCH] Add missing code fold styles to types

---
 README.md                       |  1 +
 src/styles.ts                   |  3 +++
 test/react-diff-viewer-test.tsx | 30 ++++++++++++++++++++++++++++++
 3 files changed, 34 insertions(+)

diff --git a/README.md b/README.md
index 6be4b73e..cbe765c5 100644
--- a/README.md
+++ b/README.md
@@ -275,6 +275,7 @@ const defaultStyles = {
   wordDiff?: {}, // style object
   wordAdded?: {}, // style object
   wordRemoved?: {}, // style object
+  codeFoldContent?: {}, // style object
   codeFoldGutter?: {}, // style object
   codeFold?: {}, // style object
   emptyLine?: {}, // style object
diff --git a/src/styles.ts b/src/styles.ts
index f11930c5..bbbe2c16 100644
--- a/src/styles.ts
+++ b/src/styles.ts
@@ -19,6 +19,7 @@ export interface ReactDiffViewerStyles {
 	emptyGutter?: string;
 	emptyLine?: string;
 	codeFold?: string;
+	codeFoldContent?: string;
 	titleBlock?: string;
 	content?: string;
 	splitView?: string;
@@ -71,6 +72,8 @@ export interface ReactDiffViewerStylesOverride {
 	wordDiff?: Interpolation;
 	wordAdded?: Interpolation;
 	wordRemoved?: Interpolation;
+	codeFold?: Interpolation;
+	codeFoldContent?: Interpolation;
 	codeFoldGutter?: Interpolation;
 	emptyLine?: Interpolation;
 	content?: Interpolation;
diff --git a/test/react-diff-viewer-test.tsx b/test/react-diff-viewer-test.tsx
index e51e1320..bff47c61 100644
--- a/test/react-diff-viewer-test.tsx
+++ b/test/react-diff-viewer-test.tsx
@@ -51,4 +51,34 @@ describe('Testing react diff viewer', (): void => {
 
     expect(node.find('table > tbody tr').length).toEqual(9);
   });
+
+  it('It should allow overriding styles', (): void => {
+    shallow(<DiffViewer
+      oldValue={oldCode}
+      newValue={newCode}
+      styles={{
+        diffContainer: { background: "red" },
+        diffRemoved: { background: "red" },
+        diffAdded: { background: "red" },
+        splitView: { background: "red" },
+        marker: { background: "red" },
+        highlightedGutter: { background: "red" },
+        highlightedLine: { background: "red" },
+        gutter: { background: "red" },
+        line: { background: "red" },
+        wordDiff: { background: "red" },
+        wordAdded: { background: "red" },
+        wordRemoved: { background: "red" },
+        codeFoldGutter: { background: "red" },
+        codeFold: { background: "red" },
+        emptyGutter: { background: "red" },
+        emptyLine: { background: "red" },
+        lineNumber: { background: "red" },
+        contentText: { background: "red" },
+        content: { background: "red" },
+        codeFoldContent: { background: "red" },
+        titleBlock: { background: "red" },
+      }}
+    />);
+  })
 });