Merge pull request #227 from jy95/refactor-docs

docs: use tabs to focus on what matter
jy95 · Dec 17, 2023 · ee2939b · ee2939b
2 parents 0375ddb + a551057
commit ee2939b
Show file tree

Hide file tree

Showing 55 changed files with 576 additions and 412 deletions.
diff --git a/testsite/docs/demo-viewer/array/additionalItems1.mdx b/testsite/docs/demo-viewer/array/additionalItems1.mdx
@@ -6,13 +6,16 @@ title: ❌ AdditionalItems (1)
 import CodeBlock from '@theme/CodeBlock';
 import Schema from "@site/static/schemas/examples/array/additionalItems1.json";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 
 # AdditionalItems (1)
 
-JSON Schema :
-
-<CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
-
-Viewer :
-
-<JSONSchemaViewer schema={ Schema  } />
+<Tabs>
+    <TabItem value="Viewer" label="Viewer" default>
+        <JSONSchemaViewer schema={Schema} />
+    </TabItem>
+    <TabItem value="JSON Schema" label='JSON Schema'>
+        <CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
+    </TabItem>
+</Tabs>
diff --git a/testsite/docs/demo-viewer/array/additionalItems2.mdx b/testsite/docs/demo-viewer/array/additionalItems2.mdx
@@ -6,13 +6,16 @@ title: ➕ AdditionalItems (2)
 import CodeBlock from '@theme/CodeBlock';
 import Schema from "@site/static/schemas/examples/array/additionalItems2.json";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 
 # AdditionalItems (2)
 
-JSON Schema :
-
-<CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
-
-Viewer :
-
-<JSONSchemaViewer schema={ Schema  } />
+<Tabs>
+    <TabItem value="Viewer" label="Viewer" default>
+        <JSONSchemaViewer schema={Schema} />
+    </TabItem>
+    <TabItem value="JSON Schema" label='JSON Schema'>
+        <CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
+    </TabItem>
+</Tabs>
diff --git a/testsite/docs/demo-viewer/array/contains.mdx b/testsite/docs/demo-viewer/array/contains.mdx
@@ -6,13 +6,16 @@ title: 🍱 Contains
 import CodeBlock from '@theme/CodeBlock';
 import Schema from "@site/static/schemas/examples/array/contains.json";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 
 # Contains
 
-JSON Schema :
-
-<CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
-
-Viewer :
-
-<JSONSchemaViewer schema={ Schema  } />
+<Tabs>
+    <TabItem value="Viewer" label="Viewer" default>
+        <JSONSchemaViewer schema={Schema} />
+    </TabItem>
+    <TabItem value="JSON Schema" label='JSON Schema'>
+        <CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
+    </TabItem>
+</Tabs>
diff --git a/testsite/docs/demo-viewer/array/items.mdx b/testsite/docs/demo-viewer/array/items.mdx
@@ -6,13 +6,16 @@ title: 🛍️ Items
 import CodeBlock from '@theme/CodeBlock';
 import Schema from "@site/static/schemas/examples/array/items.json";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 
 # Items
 
-JSON Schema :
-
-<CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
-
-Viewer :
-
-<JSONSchemaViewer schema={ Schema  } />
+<Tabs>
+    <TabItem value="Viewer" label="Viewer" default>
+        <JSONSchemaViewer schema={Schema} />
+    </TabItem>
+    <TabItem value="JSON Schema" label='JSON Schema'>
+        <CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
+    </TabItem>
+</Tabs>
diff --git a/testsite/docs/demo-viewer/array/length.mdx b/testsite/docs/demo-viewer/array/length.mdx
@@ -6,13 +6,16 @@ title: 📐 Length
 import CodeBlock from '@theme/CodeBlock';
 import Schema from "@site/static/schemas/examples/array/length.json";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 
 # Length
 
-JSON Schema :
-
-<CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
-
-Viewer :
-
-<JSONSchemaViewer schema={ Schema  } />
+<Tabs>
+    <TabItem value="Viewer" label="Viewer" default>
+        <JSONSchemaViewer schema={Schema} />
+    </TabItem>
+    <TabItem value="JSON Schema" label='JSON Schema'>
+        <CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
+    </TabItem>
+</Tabs>
diff --git a/testsite/docs/demo-viewer/array/minContainsAndMaxContains.mdx b/testsite/docs/demo-viewer/array/minContainsAndMaxContains.mdx
@@ -6,13 +6,16 @@ title: "📊 minContains & maxContains"
 import CodeBlock from '@theme/CodeBlock';
 import Schema from "@site/static/schemas/examples/array/minContainsAndMaxContains.json";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 
 # minContains & maxContains
 
-JSON Schema :
-
-<CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
-
-Viewer :
-
-<JSONSchemaViewer schema={ Schema  } />
+<Tabs>
+    <TabItem value="Viewer" label="Viewer" default>
+        <JSONSchemaViewer schema={Schema} />
+    </TabItem>
+    <TabItem value="JSON Schema" label='JSON Schema'>
+        <CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
+    </TabItem>
+</Tabs>
diff --git a/testsite/docs/demo-viewer/array/simple.mdx b/testsite/docs/demo-viewer/array/simple.mdx
@@ -6,13 +6,16 @@ title: "🟦 Simple"
 import CodeBlock from '@theme/CodeBlock';
 import Schema from "@site/static/schemas/examples/array/simple.json";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 
 # Simple
 
-JSON Schema :
-
-<CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
-
-Viewer :
-
-<JSONSchemaViewer schema={ Schema  } />
+<Tabs>
+    <TabItem value="Viewer" label="Viewer" default>
+        <JSONSchemaViewer schema={Schema} />
+    </TabItem>
+    <TabItem value="JSON Schema" label='JSON Schema'>
+        <CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
+    </TabItem>
+</Tabs>
diff --git a/testsite/docs/demo-viewer/array/tuples.mdx b/testsite/docs/demo-viewer/array/tuples.mdx
@@ -6,13 +6,16 @@ title: "📋 Tuples"
 import CodeBlock from '@theme/CodeBlock';
 import Schema from "@site/static/schemas/examples/array/tuples.json";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 
 # Tuples
 
-JSON Schema :
-
-<CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
-
-Viewer :
-
-<JSONSchemaViewer schema={ Schema  } />
+<Tabs>
+    <TabItem value="Viewer" label="Viewer" default>
+        <JSONSchemaViewer schema={Schema} />
+    </TabItem>
+    <TabItem value="JSON Schema" label='JSON Schema'>
+        <CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
+    </TabItem>
+</Tabs>
diff --git a/testsite/docs/demo-viewer/array/unevaluatedItems1.mdx b/testsite/docs/demo-viewer/array/unevaluatedItems1.mdx
@@ -6,13 +6,16 @@ title: 🤔 UnevaluatedItems (1)
 import CodeBlock from '@theme/CodeBlock';
 import Schema from "@site/static/schemas/examples/array/unevaluatedItems1.json";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 
 # UnevaluatedItems (1)
 
-JSON Schema :
-
-<CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
-
-Viewer :
-
-<JSONSchemaViewer schema={ Schema  } />
+<Tabs>
+    <TabItem value="Viewer" label="Viewer" default>
+        <JSONSchemaViewer schema={Schema} />
+    </TabItem>
+    <TabItem value="JSON Schema" label='JSON Schema'>
+        <CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
+    </TabItem>
+</Tabs>
diff --git a/testsite/docs/demo-viewer/array/unevaluatedItems2.mdx b/testsite/docs/demo-viewer/array/unevaluatedItems2.mdx
@@ -6,13 +6,16 @@ title: 📋 UnevaluatedItems (2)
 import CodeBlock from '@theme/CodeBlock';
 import Schema from "@site/static/schemas/examples/array/unevaluatedItems2.json";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 
 # UnevaluatedItems (2)
 
-JSON Schema :
-
-<CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
-
-Viewer :
-
-<JSONSchemaViewer schema={ Schema  } />
+<Tabs>
+    <TabItem value="Viewer" label="Viewer" default>
+        <JSONSchemaViewer schema={Schema} />
+    </TabItem>
+    <TabItem value="JSON Schema" label='JSON Schema'>
+        <CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
+    </TabItem>
+</Tabs>
diff --git a/testsite/docs/demo-viewer/array/uniqueItems.mdx b/testsite/docs/demo-viewer/array/uniqueItems.mdx
@@ -6,13 +6,16 @@ title: "🦄 Unique items"
 import CodeBlock from '@theme/CodeBlock';
 import Schema from "@site/static/schemas/examples/array/uniqueItems.json";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 
 # Unique items
 
-JSON Schema :
-
-<CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
-
-Viewer :
-
-<JSONSchemaViewer schema={ Schema  } />
+<Tabs>
+    <TabItem value="Viewer" label="Viewer" default>
+        <JSONSchemaViewer schema={Schema} />
+    </TabItem>
+    <TabItem value="JSON Schema" label='JSON Schema'>
+        <CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
+    </TabItem>
+</Tabs>
diff --git a/testsite/docs/demo-viewer/boolean.mdx b/testsite/docs/demo-viewer/boolean.mdx
@@ -6,13 +6,16 @@ title: "✅ Boolean"
 import CodeBlock from '@theme/CodeBlock';
 import Schema from "@site/static/schemas/examples/boolean/simple.json";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 
 # Boolean
 
-JSON Schema :
-
-<CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
-
-Viewer :
-
-<JSONSchemaViewer schema={ Schema  } />
+<Tabs>
+    <TabItem value="Viewer" label="Viewer" default>
+        <JSONSchemaViewer schema={Schema} />
+    </TabItem>
+    <TabItem value="JSON Schema" label='JSON Schema'>
+        <CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
+    </TabItem>
+</Tabs>
diff --git a/testsite/docs/demo-viewer/generic_keywords/annotations.mdx b/testsite/docs/demo-viewer/generic_keywords/annotations.mdx
@@ -7,28 +7,30 @@ import CodeBlock from '@theme/CodeBlock';
 import Schema from "@site/static/schemas/examples/generic_keywords/annotations.json";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
 import ReactMarkdown from 'react-markdown'
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 
 # Annotations
 
-JSON Schema :
-
-<CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
-
-viewerOptions :
-
-```js
-{
-    showExamples: true,
-    DescriptionComponent: ({description}) => <ReactMarkdown children={description} />
-}
-```
-
-Viewer :
-
-<JSONSchemaViewer 
-    schema={ Schema } 
-    viewerOptions={{ 
-        showExamples: true,
-        DescriptionComponent: ({description}) => <ReactMarkdown children={description} /> 
-    }}
-/>
+<Tabs>
+    <TabItem value="Viewer" label="Viewer" default>
+        <JSONSchemaViewer 
+            schema={ Schema } 
+            viewerOptions={{ 
+                showExamples: true,
+                DescriptionComponent: ({description}) => <ReactMarkdown children={description} /> 
+            }}
+        />
+    </TabItem>
+    <TabItem value="viewerOptions" label='viewerOptions'>
+        ```js
+        {
+            showExamples: true,
+            DescriptionComponent: ({description}) => <ReactMarkdown children={description} />
+        }
+        ```
+    </TabItem>
+    <TabItem value="JSON Schema" label='JSON Schema'>
+        <CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
+    </TabItem>
+</Tabs>
diff --git a/testsite/docs/demo-viewer/generic_keywords/const.mdx b/testsite/docs/demo-viewer/generic_keywords/const.mdx
@@ -6,13 +6,16 @@ title: "🧊 Const"
 import CodeBlock from '@theme/CodeBlock';
 import Schema from "@site/static/schemas/examples/generic_keywords/const.json";
 import JSONSchemaViewer from "@theme/JSONSchemaViewer";
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
 
 # Const
 
-JSON Schema :
-
-<CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
-
-Viewer :
-
-<JSONSchemaViewer schema={ Schema  } />
+<Tabs>
+    <TabItem value="Viewer" label="Viewer" default>
+        <JSONSchemaViewer schema={Schema} />
+    </TabItem>
+    <TabItem value="JSON Schema" label='JSON Schema'>
+        <CodeBlock language="json">{JSON.stringify(Schema, null, 2)}</CodeBlock>
+    </TabItem>
+</Tabs>