Fixed preact errors regarding `contentEditable`
This commit is contained in:
parent
4baa98c961
commit
7f6e7459df
|
@ -53,7 +53,6 @@ export default class JSONNode extends Component {
|
||||||
this.renderExpandButton(),
|
this.renderExpandButton(),
|
||||||
this.renderContextMenuButton(),
|
this.renderContextMenuButton(),
|
||||||
this.renderProperty(path, data, options),
|
this.renderProperty(path, data, options),
|
||||||
this.renderSeparator(), // TODO: remove separator for Object and Array (gives an issue in Preact)
|
|
||||||
this.renderReadonly(`{${childCount}}`, `Array containing ${childCount} items`)
|
this.renderReadonly(`{${childCount}}`, `Array containing ${childCount} items`)
|
||||||
])
|
])
|
||||||
]
|
]
|
||||||
|
@ -81,7 +80,6 @@ export default class JSONNode extends Component {
|
||||||
this.renderExpandButton(),
|
this.renderExpandButton(),
|
||||||
this.renderContextMenuButton(),
|
this.renderContextMenuButton(),
|
||||||
this.renderProperty(path, data, options),
|
this.renderProperty(path, data, options),
|
||||||
this.renderSeparator(), // TODO: remove separator for Object and Array (gives an issue in Preact)
|
|
||||||
this.renderReadonly(`[${childCount}]`, `Array containing ${childCount} items`)
|
this.renderReadonly(`[${childCount}]`, `Array containing ${childCount} items`)
|
||||||
])
|
])
|
||||||
]
|
]
|
||||||
|
@ -105,7 +103,7 @@ export default class JSONNode extends Component {
|
||||||
renderJSONValue ({path, data, options}) {
|
renderJSONValue ({path, data, options}) {
|
||||||
return h('li', {}, [
|
return h('li', {}, [
|
||||||
h('div', {class: 'jsoneditor-node'}, [
|
h('div', {class: 'jsoneditor-node'}, [
|
||||||
h('div', {class: 'jsoneditor-button-placeholder'}),
|
h('div', {class: 'jsoneditor-button-placeholder', contentEditable: 'false'}),
|
||||||
this.renderContextMenuButton(),
|
this.renderContextMenuButton(),
|
||||||
this.renderProperty(path, data, options),
|
this.renderProperty(path, data, options),
|
||||||
this.renderSeparator(),
|
this.renderSeparator(),
|
||||||
|
@ -115,7 +113,7 @@ export default class JSONNode extends Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
renderReadonly (text, title = null) {
|
renderReadonly (text, title = null) {
|
||||||
return h('div', {class: 'jsoneditor-readonly', contentEditable: false, title}, text)
|
return h('div', {class: 'jsoneditor-readonly', contentEditable: 'false', title}, text)
|
||||||
}
|
}
|
||||||
|
|
||||||
renderProperty (path, data, options) {
|
renderProperty (path, data, options) {
|
||||||
|
@ -153,7 +151,7 @@ export default class JSONNode extends Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
renderSeparator() {
|
renderSeparator() {
|
||||||
return h('div', {class: 'jsoneditor-separator'}, ':')
|
return h('div', {class: 'jsoneditor-separator', contentEditable: 'false'}, ':')
|
||||||
}
|
}
|
||||||
|
|
||||||
renderValue (value) {
|
renderValue (value) {
|
||||||
|
@ -163,7 +161,7 @@ export default class JSONNode extends Component {
|
||||||
|
|
||||||
return h('div', {
|
return h('div', {
|
||||||
class: valueClass,
|
class: valueClass,
|
||||||
contentEditable: true,
|
contentEditable: 'true',
|
||||||
spellCheck: 'false',
|
spellCheck: 'false',
|
||||||
onInput: this.handleChangeValue,
|
onInput: this.handleChangeValue,
|
||||||
onClick: this.handleClickValue,
|
onClick: this.handleClickValue,
|
||||||
|
@ -174,7 +172,7 @@ export default class JSONNode extends Component {
|
||||||
|
|
||||||
renderExpandButton () {
|
renderExpandButton () {
|
||||||
const className = `jsoneditor-button jsoneditor-${this.props.data.expanded ? 'expanded' : 'collapsed'}`
|
const className = `jsoneditor-button jsoneditor-${this.props.data.expanded ? 'expanded' : 'collapsed'}`
|
||||||
return h('div', {class: 'jsoneditor-button-container'},
|
return h('div', {class: 'jsoneditor-button-container', contentEditable: 'false'},
|
||||||
h('button', {class: className, onClick: this.handleExpand})
|
h('button', {class: className, onClick: this.handleExpand})
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
@ -183,7 +181,7 @@ export default class JSONNode extends Component {
|
||||||
const className = 'jsoneditor-button jsoneditor-contextmenu' +
|
const className = 'jsoneditor-button jsoneditor-contextmenu' +
|
||||||
(this.props.data.contextMenu ? ' jsoneditor-visible' : '')
|
(this.props.data.contextMenu ? ' jsoneditor-visible' : '')
|
||||||
|
|
||||||
return h('div', {class: 'jsoneditor-button-container'},
|
return h('div', {class: 'jsoneditor-button-container', contentEditable: 'false'},
|
||||||
this.props.data.contextMenu
|
this.props.data.contextMenu
|
||||||
? this.renderContextMenu(this.props.data.contextMenu)
|
? this.renderContextMenu(this.props.data.contextMenu)
|
||||||
: null,
|
: null,
|
||||||
|
|
|
@ -47,8 +47,8 @@ export default class Main extends Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
return h('div', {class: 'jsoneditor', onClick: this.handleHideContextMenu}, [
|
return h('div', {class: 'jsoneditor', contentEditable: 'false', onClick: this.handleHideContextMenu}, [
|
||||||
h('ul', {class: 'jsoneditor-list'}, [
|
h('ul', {class: 'jsoneditor-list', contentEditable: 'false'}, [
|
||||||
h(JSONNode, {
|
h(JSONNode, {
|
||||||
data: this.state.data,
|
data: this.state.data,
|
||||||
events: this.state.events,
|
events: this.state.events,
|
||||||
|
|
|
@ -20,6 +20,8 @@
|
||||||
const editor = jsoneditor(container, options);
|
const editor = jsoneditor(container, options);
|
||||||
const json = {
|
const json = {
|
||||||
'array': [1, 2, 3],
|
'array': [1, 2, 3],
|
||||||
|
'emptyArray': [],
|
||||||
|
'emptyObject': {},
|
||||||
'boolean': true,
|
'boolean': true,
|
||||||
'null': null,
|
'null': null,
|
||||||
'number': 123,
|
'number': 123,
|
||||||
|
@ -28,9 +30,9 @@
|
||||||
};
|
};
|
||||||
editor.set(json, {
|
editor.set(json, {
|
||||||
name: 'myObject',
|
name: 'myObject',
|
||||||
expand: function (path) {
|
// expand: function (path) {
|
||||||
return true
|
// return true
|
||||||
}
|
// }
|
||||||
});
|
});
|
||||||
|
|
||||||
// set json
|
// set json
|
||||||
|
|
Loading…
Reference in New Issue