Editor tools for use in React based JSON schema editors
npm install config-editor-toolsbash
npm install --save config-editor-tools
`
---
$3
You can directly test the "raw" configuration editor by cloning this repository and running below npm install in root and in the example/ folder. After this, run npm start in the root as well as in the example/ folder.
---
$3
To publish your own custom version as an npm package, you can modify the package.json and run npm publish. You'll need to be logged in first.
Usage in a parent app
The editor tools are self-contained modals and can be imported into parent apps in a simple way as below:
`jsx
import React from 'react'
import { BitRateModal, FilterModal, EncryptionModal } from 'config-editor-tools'
const App = () => {
return
}
export default App
`
----
Usage in a config-editor-base modules
A typical use case is to parse a list of editor tools to the config-editor-base module as in e.g. the CANedge configuration editor. This can be done via below syntax:
`jsx
import React from 'react'
import { connect } from 'react-redux'
import { EncryptionModal } from 'config-editor-tools'
import { EditorSection } from 'config-editor-base'
import * as actionsAlert from '../alert/actions'
import AlertContainer from '../alert/AlertContainer'
class Editor extends React.Component {
render() {
let editorTools = [
{
name: 'encryption-modal',
comment: 'Encryption tool',
class: 'fa fa-lock',
modal:
}
]
return (
editorTools={editorTools}
showAlert={this.props.showAlert}
/>
)
}
}
const mapDispatchToProps = (dispatch) => {
return {
showAlert: (type, message) =>
dispatch(actionsAlert.set({ type: type, message: message }))
}
}
export default connect(null, mapDispatchToProps)(Editor)
``