From c44a23597e1401b2e314b571ac6d24bfd56db386 Mon Sep 17 00:00:00 2001
From: "g. nicholas d'andrea" <nick@gnidan.org>
Date: Thu, 21 Dec 2023 22:04:02 -0500
Subject: [PATCH] Render example values with indented code blocks

... using docusaurus-json-schema-plugin new customizable ValueComponent
---
 web/package.json                    |  2 +-
 web/src/components/SchemaViewer.tsx | 21 ++++++++++++++++++++-
 web/yarn.lock                       |  8 ++++----
 3 files changed, 25 insertions(+), 6 deletions(-)

diff --git a/web/package.json b/web/package.json
index db7030cc..a3edd1fe 100644
--- a/web/package.json
+++ b/web/package.json
@@ -23,7 +23,7 @@
     "@fortawesome/react-fontawesome": "^0.2.0",
     "@mdx-js/react": "^3.0.0",
     "clsx": "^1.2.1",
-    "docusaurus-json-schema-plugin": "^1.7.0",
+    "docusaurus-json-schema-plugin": "^1.9.0",
     "jsonpointer": "^5.0.1",
     "prism-react-renderer": "^2.1.0",
     "react": "^18.0.0",
diff --git a/web/src/components/SchemaViewer.tsx b/web/src/components/SchemaViewer.tsx
index c06a1129..7e712d5b 100644
--- a/web/src/components/SchemaViewer.tsx
+++ b/web/src/components/SchemaViewer.tsx
@@ -1,4 +1,5 @@
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
+import CodeBlock from "@theme/CodeBlock";
 import { loadSchema } from "@site/src/loadSchema";
 
 export interface SchemaViewerProps {
@@ -17,7 +18,25 @@ export default function SchemaViewer({
         jsonPointer: pointer
       }}
       viewerOptions={{
-        showExamples: true
+        showExamples: true,
+        ValueComponent: ({ value }) => {
+          // deal with simple types first
+          if ([
+            "string",
+            "number",
+            "bigint",
+            "boolean"
+          ].includes(typeof value)) {
+            return <code>{
+              (value as string | number | bigint | boolean).toString()
+            }</code>;
+          }
+
+          // for complex types use a whole CodeBlock
+          return <CodeBlock language="json">{`${
+            JSON.stringify(value, undefined, 2)
+          }`}</CodeBlock>;
+        }
       }} />
   );
 }
diff --git a/web/yarn.lock b/web/yarn.lock
index 9789a5e3..b5be9879 100644
--- a/web/yarn.lock
+++ b/web/yarn.lock
@@ -3756,10 +3756,10 @@ dns-packet@^5.2.2:
   dependencies:
     "@leichtgewicht/ip-codec" "^2.0.1"
 
-docusaurus-json-schema-plugin@^1.7.0:
-  version "1.7.0"
-  resolved "https://registry.yarnpkg.com/docusaurus-json-schema-plugin/-/docusaurus-json-schema-plugin-1.7.0.tgz#e001e1089f13eeca61db9d552cff6e3a520d9576"
-  integrity sha512-Q9m6kIcCzA3CEtzaWBsgXbve8dWHInhO2XRvmJfFM6PYxcabGnmYBgJ13gI3PaIrt8SdBebc9v2ewj2Y0XfpLQ==
+docusaurus-json-schema-plugin@^1.9.0:
+  version "1.9.0"
+  resolved "https://registry.yarnpkg.com/docusaurus-json-schema-plugin/-/docusaurus-json-schema-plugin-1.9.0.tgz#c217c88f14b034c182d98dc1344c55907068bb7b"
+  integrity sha512-MZiaNyI/VY8wj3hfAqn6WFCDcmBaLSURlzk+NWT43o+3dw6h0pwJW9GN3NFgqZED2eNSJzJ3c2Y/OBKKKampkA==
   dependencies:
     "@stoplight/json-ref-resolver" "^3.1.5"
     monaco-editor "^0.39.0"