+ jsonListOutput={jsonListOutput} expandToGeneration={expandToGeneration} isReadOnly={isReadOnly}/>
)
})
)
@@ -178,12 +182,14 @@ export default function JsonView(
* @param setPrimitive changes a primitive value
* @param createModal creates edit modal component
* @param createEditModal saves information with current position node of for modal editor when a user clicks add or edit button
+ * @param expandToGeneration Show content if the child's generation index is > expandToGeneration
+ * @param isReadOnly true: do not show edit && delete buttons
* @returns {JSX.Element}
*
*/
-function ViewNode({ jsonPath, field, value, jsonListOutput, indent, isInArray, deleteNode, setPrimitive, createModal, createEditModal}) {
+function ViewNode({ jsonPath, field, value, jsonListOutput, indent, isInArray, deleteNode, setPrimitive, createModal, createEditModal, expandToGeneration, isReadOnly}) {
- const [showContent, setShowContent] = useState(true)
+ const [showContent, setShowContent] = useState(expandToGeneration === undefined ? true : (jsonPath.match(/\//g) || []).length <= expandToGeneration)
const [focusOnLine, setFocusOnLine] = useState(false)
const isList = value instanceof Object
// current clickNode position
@@ -194,11 +200,15 @@ function ViewNode({ jsonPath, field, value, jsonListOutput, indent, isInArray, d
{setFocusOnLine(true)}} onMouseLeave={()=>{setFocusOnLine(false)}}
+ style={{backgroundColor: focusOnLine ? userStyle.themes.hoverColor : '', cursor: isReadOnly ? 'default': 'pointer'}} onMouseOver={()=>{setFocusOnLine(!isReadOnly && true)}} onMouseLeave={()=>{setFocusOnLine(false)}}
onClick={(e)=>{
e.stopPropagation();
e.preventDefault();
+ if (isReadOnly) {
+ return;
+ }
+
if(isList) {
setShowContent(!showContent)
}else{
@@ -224,7 +234,7 @@ function ViewNode({ jsonPath, field, value, jsonListOutput, indent, isInArray, d
- { focusOnLine &&
+ { !isReadOnly && focusOnLine &&
@@ -248,7 +258,7 @@ function ViewNode({ jsonPath, field, value, jsonListOutput, indent, isInArray, d
}
{
- !isList &&
+ !isList &&
}
@@ -258,7 +268,7 @@ function ViewNode({ jsonPath, field, value, jsonListOutput, indent, isInArray, d
isList && showContent &&
+ jsonListOutput={jsonListOutput} createModal={createModal} expandToGeneration={expandToGeneration} isReadOnly={isReadOnly} />
}
diff --git a/src/index.js b/src/index.js
index e66ed38..0827992 100644
--- a/src/index.js
+++ b/src/index.js
@@ -13,7 +13,7 @@ import UserContext from "./UserContext"
* @returns {JSX.Element}
*
*/
-function JsonEditor({jsonObject, onChange, theme, bannerStyle, keyStyle, valueStyle, buttonStyle}) {
+function JsonEditor({jsonObject, onChange, theme, hideInsertObjectButton, expandToGeneration, isReadOnly, bannerStyle, keyStyle, valueStyle, buttonStyle}) {
const jsonBoxRef = useRef()
const defaultStyle = useContext(UserContext)
@@ -27,7 +27,7 @@ function JsonEditor({jsonObject, onChange, theme, bannerStyle, keyStyle, valueSt
buttons: buttonStyle === undefined ? defaultStyle.buttons : buttonStyle
}}>
-
+
)