Fixed broken modes `form` and `view`
This commit is contained in:
parent
ce484c670a
commit
675432c52d
|
@ -149,7 +149,7 @@ export default class JSONNode extends Component {
|
||||||
return h('div', {key: 'readonly', className: 'jsoneditor-readonly', title}, text)
|
return h('div', {key: 'readonly', className: 'jsoneditor-readonly', title}, text)
|
||||||
}
|
}
|
||||||
|
|
||||||
renderProperty (prop: ?PropertyData, index: ?number, data: JSONData, options) {
|
renderProperty (prop: ?PropertyData, index: ?number, data: JSONData, options: {escapeUnicode: boolean, isPropertyEditable: (Path) => boolean}) {
|
||||||
const isIndex = typeof index === 'number'
|
const isIndex = typeof index === 'number'
|
||||||
|
|
||||||
if (!prop && !isIndex) {
|
if (!prop && !isIndex) {
|
||||||
|
|
|
@ -1,7 +1,9 @@
|
||||||
import { createElement as h } from 'react'
|
// @flow
|
||||||
import { escapeHTML } from '../utils/stringUtils'
|
|
||||||
import JSONNode from './JSONNode'
|
import JSONNode from './JSONNode'
|
||||||
|
|
||||||
|
import type { PropertyData, JSONData } from '../types'
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* JSONNodeForm
|
* JSONNodeForm
|
||||||
*
|
*
|
||||||
|
@ -20,33 +22,13 @@ export default class JSONNodeForm extends JSONNode {
|
||||||
}
|
}
|
||||||
|
|
||||||
// render a readonly property
|
// render a readonly property
|
||||||
renderProperty (prop, data, options) {
|
renderProperty (prop: ?PropertyData, index: ?number, data: JSONData, options: {escapeUnicode: boolean, isPropertyEditable: (Path) => boolean}) {
|
||||||
if (prop !== null) {
|
const formOptions = Object.assign({}, options, { isPropertyEditable })
|
||||||
const isIndex = typeof prop === 'number' // FIXME: pass an explicit prop isIndex
|
|
||||||
|
|
||||||
if (isIndex) { // array item
|
return JSONNode.prototype.renderProperty.call(this, prop, index, data, formOptions)
|
||||||
return h('div', {
|
|
||||||
key: 'property',
|
|
||||||
className: 'jsoneditor-property jsoneditor-readonly'
|
|
||||||
}, prop)
|
|
||||||
}
|
|
||||||
else { // object property
|
|
||||||
const escapedProp = escapeHTML(prop, options.escapeUnicode)
|
|
||||||
|
|
||||||
return h('div', {
|
|
||||||
key: 'property',
|
|
||||||
className: 'jsoneditor-property' + (prop.length === 0 ? ' jsoneditor-empty' : '')
|
|
||||||
}, escapedProp)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
// root node
|
|
||||||
const content = JSONNode.getRootName(data, options)
|
|
||||||
|
|
||||||
return h('div', {
|
|
||||||
key: 'property',
|
|
||||||
className: 'jsoneditor-property jsoneditor-readonly'
|
|
||||||
}, content)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function isPropertyEditable () {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
|
@ -12,26 +12,31 @@ import JSONNodeForm from './JSONNodeForm'
|
||||||
*/
|
*/
|
||||||
export default class JSONNodeView extends JSONNodeForm {
|
export default class JSONNodeView extends JSONNodeForm {
|
||||||
|
|
||||||
// render a readonly value
|
// render a readonly value but with colors
|
||||||
renderValue (value) {
|
renderValue (value, searchResult, options) {
|
||||||
const escapedValue = escapeHTML(value, options.escapeUnicode)
|
const escapedValue = escapeHTML(value, options.escapeUnicode)
|
||||||
const type = valueType (value)
|
const type = valueType (value)
|
||||||
const isEmpty = escapedValue.length === 0
|
|
||||||
const itsAnUrl = isUrl(value)
|
const itsAnUrl = isUrl(value)
|
||||||
const className = JSONNode.getValueClass(type, itsAnUrl, isEmpty)
|
const isEmpty = escapedValue.length === 0
|
||||||
|
|
||||||
if (itsAnUrl) {
|
const editable = !options.isValueEditable || options.isValueEditable(this.props.path)
|
||||||
return h('a', {
|
if (editable) {
|
||||||
|
return h('div', {
|
||||||
key: 'value',
|
key: 'value',
|
||||||
className: className,
|
ref: 'value',
|
||||||
href: escapedValue
|
className: JSONNode.getValueClass(type, itsAnUrl, isEmpty) +
|
||||||
|
JSONNode.getSearchResultClass(searchResult),
|
||||||
|
contentEditable: 'false',
|
||||||
|
spellCheck: 'false',
|
||||||
|
onClick: this.handleClickValue,
|
||||||
|
title: itsAnUrl ? JSONNode.URL_TITLE : null
|
||||||
}, escapedValue)
|
}, escapedValue)
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
return h('div', {
|
return h('div', {
|
||||||
key: 'value',
|
key: 'value',
|
||||||
className: className,
|
className: 'jsoneditor-readonly',
|
||||||
onClick: this.handleClickValue
|
title: itsAnUrl ? JSONNode.URL_TITLE : null
|
||||||
}, escapedValue)
|
}, escapedValue)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue