diff --git a/src/core/plugins/json-schema-2020-12/components/ExpandDeepButton/_expand-deep-button.scss b/src/core/plugins/json-schema-2020-12/components/ExpandDeepButton/_expand-deep-button.scss
index 476543c0..7847ebef 100644
--- a/src/core/plugins/json-schema-2020-12/components/ExpandDeepButton/_expand-deep-button.scss
+++ b/src/core/plugins/json-schema-2020-12/components/ExpandDeepButton/_expand-deep-button.scss
@@ -3,4 +3,5 @@
font-size: 12px;
color: rgb(175, 174, 174);
border: none;
+ padding-right: 0;
}
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 23ed1638..5a15e3ef 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
@@ -9,6 +9,7 @@ import * as propTypes from "../../prop-types"
import {
useComponent,
useLevel,
+ useFn,
useIsEmbedded,
useIsExpandedDeeply,
} from "../../hooks"
@@ -18,11 +19,13 @@ import {
} from "../../context"
const JSONSchema = ({ schema, name }) => {
+ const fn = useFn()
const isExpandedDeeply = useIsExpandedDeeply()
const [expanded, setExpanded] = useState(isExpandedDeeply)
const [expandedDeeply, setExpandedDeeply] = useState(false)
const [level, nextLevel] = useLevel()
const isEmbedded = useIsEmbedded()
+ const isExpandable = fn.isExpandable(schema)
const Accordion = useComponent("Accordion")
const KeywordProperties = useComponent("KeywordProperties")
const KeywordType = useComponent("KeywordType")
@@ -63,13 +66,19 @@ const JSONSchema = ({ schema, name }) => {
})}
>
-
+ {isExpandable ? (
+ <>
+
+
+
+
+ >
+ ) : (
-
-
+ )}
diff --git a/src/core/plugins/json-schema-2020-12/components/keywords/Properties.jsx b/src/core/plugins/json-schema-2020-12/components/keywords/Properties.jsx
index f2ba3844..e0a4efa7 100644
--- a/src/core/plugins/json-schema-2020-12/components/keywords/Properties.jsx
+++ b/src/core/plugins/json-schema-2020-12/components/keywords/Properties.jsx
@@ -4,10 +4,9 @@
import React from "react"
import { schema } from "../../prop-types"
-import { useFn, useComponent } from "../../hooks"
+import { useComponent } from "../../hooks"
const Properties = ({ schema }) => {
- const fn = useFn()
const JSONSchema = useComponent("JSONSchema")
const properties = schema?.properties || {}
diff --git a/src/core/plugins/json-schema-2020-12/components/keywords/Title/_title.scss b/src/core/plugins/json-schema-2020-12/components/keywords/Title/_title.scss
index 11b5330c..e4499aa3 100644
--- a/src/core/plugins/json-schema-2020-12/components/keywords/Title/_title.scss
+++ b/src/core/plugins/json-schema-2020-12/components/keywords/Title/_title.scss
@@ -11,7 +11,7 @@
.json-schema-2020-12__title {
@include text_code();
font-size: 12px;
- vertical-align: bottom;
+ vertical-align: middle;
}
}
}
diff --git a/src/core/plugins/json-schema-2020-12/components/keywords/Type/_type.scss b/src/core/plugins/json-schema-2020-12/components/keywords/Type/_type.scss
index 1251812d..616dd630 100644
--- a/src/core/plugins/json-schema-2020-12/components/keywords/Type/_type.scss
+++ b/src/core/plugins/json-schema-2020-12/components/keywords/Type/_type.scss
@@ -1,7 +1,18 @@
-.json-schema-2020-12__type {
- @include text_code();
- color: $prop-type-font-color;
- font-size: 12px;
- text-transform: lowercase;
- font-weight: bold;
+.json-schema-2020-12 {
+ &__type {
+ @include text_code();
+ color: $prop-type-font-color;
+ font-size: 12px;
+ text-transform: lowercase;
+ font-weight: bold;
+ padding-left: 10px;
+ }
+
+ &-property {
+ .json-schema-2020-12__type {
+ vertical-align: middle;
+ }
+ }
}
+
+
diff --git a/src/core/plugins/json-schema-2020-12/fn.js b/src/core/plugins/json-schema-2020-12/fn.js
index 3d5ec7ae..6df0730a 100644
--- a/src/core/plugins/json-schema-2020-12/fn.js
+++ b/src/core/plugins/json-schema-2020-12/fn.js
@@ -63,7 +63,7 @@ export const getType = (schema, processedSchemas = new WeakSet()) => {
schema.exclusiveMaximum ||
schema.multipleOf
) {
- return "number|integer"
+ return "number | integer"
} else if (schema.const !== undefined) {
if (schema.const === null) {
return "null"
@@ -110,3 +110,7 @@ export const getType = (schema, processedSchemas = new WeakSet()) => {
}
export const isBooleanJSONSchema = (schema) => typeof schema === "boolean"
+
+export const isExpandable = (schema) => {
+ return 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 6d2cd7a9..fae7edac 100644
--- a/src/core/plugins/json-schema-2020-12/hoc.jsx
+++ b/src/core/plugins/json-schema-2020-12/hoc.jsx
@@ -13,7 +13,13 @@ import Accordion from "./components/Accordion/Accordion"
import ExpandDeepButton from "./components/ExpandDeepButton/ExpandDeepButton"
import ChevronRightIcon from "./components/icons/ChevronRight"
import { JSONSchemaContext } from "./context"
-import { getTitle, isBooleanJSONSchema, upperFirst, getType } from "./fn"
+import {
+ getTitle,
+ isBooleanJSONSchema,
+ upperFirst,
+ getType,
+ isExpandable,
+} from "./fn"
export const withJSONSchemaContext = (Component, overrides = {}) => {
const value = {
@@ -38,6 +44,7 @@ export const withJSONSchemaContext = (Component, overrides = {}) => {
getTitle,
getType,
isBooleanJSONSchema,
+ isExpandable,
...overrides.fn,
},
}