diff --git a/src/core/plugins/json-schema-2020-12/components/JSONSchema/JSONSchema.jsx b/src/core/plugins/json-schema-2020-12/components/JSONSchema/JSONSchema.jsx
index d11d1181..a4a5a116 100644
--- a/src/core/plugins/json-schema-2020-12/components/JSONSchema/JSONSchema.jsx
+++ b/src/core/plugins/json-schema-2020-12/components/JSONSchema/JSONSchema.jsx
@@ -34,6 +34,7 @@ const JSONSchema = ({ schema, name }) => {
const Accordion = useComponent("Accordion")
const Keyword$schema = useComponent("Keyword$schema")
const Keyword$vocabulary = useComponent("Keyword$vocabulary")
+ const Keyword$id = useComponent("Keyword$id")
const KeywordProperties = useComponent("KeywordProperties")
const KeywordType = useComponent("KeywordType")
const KeywordFormat = useComponent("KeywordFormat")
@@ -99,6 +100,7 @@ const JSONSchema = ({ schema, name }) => {
)}
+
)}
diff --git a/src/core/plugins/json-schema-2020-12/components/JSONSchema/_json-schema.scss b/src/core/plugins/json-schema-2020-12/components/JSONSchema/_json-schema.scss
index 50b25f6d..9bedb2e5 100644
--- a/src/core/plugins/json-schema-2020-12/components/JSONSchema/_json-schema.scss
+++ b/src/core/plugins/json-schema-2020-12/components/JSONSchema/_json-schema.scss
@@ -35,11 +35,13 @@
&-core-keyword {
color: #6b6b6b;
font-size: 12px;
+ font-style: italic;
margin-left: 20px;
font-weight: bold;
&__value {
color: #6b6b6b;
+ font-style: italic;
font-size: 12px;
font-weight: normal;
}
diff --git a/src/core/plugins/json-schema-2020-12/components/keywords/$id.jsx b/src/core/plugins/json-schema-2020-12/components/keywords/$id.jsx
new file mode 100644
index 00000000..4b49a818
--- /dev/null
+++ b/src/core/plugins/json-schema-2020-12/components/keywords/$id.jsx
@@ -0,0 +1,25 @@
+/**
+ * @prettier
+ */
+import React from "react"
+
+import { schema } from "../../prop-types"
+
+const $id = ({ schema }) => {
+ if (!schema?.$id) return null
+
+ return (
+
+ $id
+
+ ={schema.$id}
+
+
+ )
+}
+
+$id.propTypes = {
+ schema: schema.isRequired,
+}
+
+export default $id
diff --git a/src/core/plugins/json-schema-2020-12/components/keywords/$vocabulary/$vocabulary.jsx b/src/core/plugins/json-schema-2020-12/components/keywords/$vocabulary/$vocabulary.jsx
index f6f0b536..312995b4 100644
--- a/src/core/plugins/json-schema-2020-12/components/keywords/$vocabulary/$vocabulary.jsx
+++ b/src/core/plugins/json-schema-2020-12/components/keywords/$vocabulary/$vocabulary.jsx
@@ -23,6 +23,7 @@ const $vocabulary = ({ schema }) => {
$vocabulary
+ object
{expanded &&
diff --git a/src/core/plugins/json-schema-2020-12/fn.js b/src/core/plugins/json-schema-2020-12/fn.js
index 6b6024cc..191e264e 100644
--- a/src/core/plugins/json-schema-2020-12/fn.js
+++ b/src/core/plugins/json-schema-2020-12/fn.js
@@ -115,6 +115,7 @@ export const isExpandable = (schema) => {
return (
schema?.$schema ||
schema?.$vocabulary ||
+ schema?.$id ||
schema?.description ||
schema?.properties
)
diff --git a/src/core/plugins/json-schema-2020-12/hoc.jsx b/src/core/plugins/json-schema-2020-12/hoc.jsx
index 9cbe91c0..0c0299fa 100644
--- a/src/core/plugins/json-schema-2020-12/hoc.jsx
+++ b/src/core/plugins/json-schema-2020-12/hoc.jsx
@@ -6,6 +6,7 @@ import React from "react"
import JSONSchema from "./components/JSONSchema/JSONSchema"
import Keyword$schema from "./components/keywords/$schema"
import Keyword$vocabulary from "./components/keywords/$vocabulary/$vocabulary"
+import Keyword$id from "./components/keywords/$id"
import KeywordProperties from "./components/keywords/Properties"
import KeywordType from "./components/keywords/Type/Type"
import KeywordFormat from "./components/keywords/Format/Format"
@@ -29,6 +30,7 @@ export const withJSONSchemaContext = (Component, overrides = {}) => {
JSONSchema,
Keyword$schema,
Keyword$vocabulary,
+ Keyword$id,
KeywordProperties,
KeywordType,
KeywordFormat,
diff --git a/src/core/plugins/json-schema-2020-12/index.js b/src/core/plugins/json-schema-2020-12/index.js
index d55f6f7d..8bef0c2a 100644
--- a/src/core/plugins/json-schema-2020-12/index.js
+++ b/src/core/plugins/json-schema-2020-12/index.js
@@ -5,6 +5,7 @@ import JSONSchema from "./components/JSONSchema/JSONSchema"
import KeywordProperties from "./components/keywords/Properties"
import Keyword$schema from "./components/keywords/$schema"
import Keyword$vocabulary from "./components/keywords/$vocabulary/$vocabulary"
+import Keyword$id from "./components/keywords/$id"
import KeywordType from "./components/keywords/Type/Type"
import KeywordFormat from "./components/keywords/Format/Format"
import KeywordTitle from "./components/keywords/Title/Title"
@@ -20,6 +21,7 @@ const JSONSchema202012Plugin = () => ({
JSONSchema202012: JSONSchema,
JSONSchema202012Keyword$schema: Keyword$schema,
JSONSchema202012Keyword$vocabulary: Keyword$vocabulary,
+ JSONSchema202012Keyword$id: Keyword$id,
JSONSchema202012KeywordProperties: KeywordProperties,
JSONSchema202012KeywordType: KeywordType,
JSONSchema202012KeywordFormat: KeywordFormat,
diff --git a/src/core/plugins/oas31/wrap-components/models.jsx b/src/core/plugins/oas31/wrap-components/models.jsx
index 15173512..5f560e50 100644
--- a/src/core/plugins/oas31/wrap-components/models.jsx
+++ b/src/core/plugins/oas31/wrap-components/models.jsx
@@ -11,6 +11,7 @@ const ModelsWrapper = createOnlyOAS31ComponentWrapper(({ getSystem }) => {
const JSONSchema = getComponent("JSONSchema202012")
const Keyword$schema = getComponent("JSONSchema202012Keyword$schema")
const Keyword$vocabulary = getComponent("JSONSchema202012Keyword$vocabulary")
+ const Keyword$id = getComponent("JSONSchema202012Keyword$id")
const KeywordProperties = getComponent("JSONSchema202012KeywordProperties")
const KeywordType = getComponent("JSONSchema202012KeywordType")
const KeywordFormat = getComponent("JSONSchema202012KeywordFormat")
@@ -32,6 +33,7 @@ const ModelsWrapper = createOnlyOAS31ComponentWrapper(({ getSystem }) => {
JSONSchema,
Keyword$schema,
Keyword$vocabulary,
+ Keyword$id,
KeywordProperties,
KeywordType,
KeywordFormat,