|
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485 |
- //
- // Copyright (C) Stanislaw Adaszewski, 2020
- // Contact: s.adaszewski@gmail.com
- // Website: https://adared.ch/wba
- // License: GPLv3
- //
-
- import { h, Component, createRef } from 'preact';
- import WBJsonViewer from 'wb-json-viewer';
- import WBAccordion from 'wb-accordion';
- import WBDialog from 'wb-dialog';
-
- class WbJsonEditorDialog extends Component {
- constructor(...args) {
- super(...args);
- this.dialogRef = createRef();
- }
-
- render({ name, onChange }, { editValue, parseError }) {
- return (
- <WBDialog title={ 'Edit ' + name } ref={ this.dialogRef }
- accept={ () => {
- onChange(JSON.parse(editValue));
- } }
- canAccept={ () => {
- try { JSON.parse(editValue) }
- catch (exc) { this.setState({ parseError: exc.message }); return false; }
- return true;
- } }>
- <div>
- <textarea class="form-control wb-json-editor" value={ editValue } rows="10"
- onChange={ e => this.setState({ editValue: e.target.value }) } />
- { parseError ? (
- <div class="alert alert-danger mt-2" role="alert">
- { parseError }
- </div>
- ) : null }
- </div>
- </WBDialog>
- );
- }
-
- show() {
- this.dialogRef.current.show();
- }
- }
-
- class WBJsonEditor extends Component {
- constructor(...args) {
- super(...args);
- this.dialogRef = createRef();
- }
-
- render({ app, name, value, stringify, pretty, onChange }, { editValue, parseError }) {
- return (
- <div>
- <WbJsonEditorDialog name={ name } onChange={ onChange } ref={ this.dialogRef } />
- <WBAccordion names={ [ name ] } extraHeaderUi={ [ (
- <button class="btn btn-link px-0" title="Edit"
- onclick={ () => {
- const dlg = this.dialogRef.current;
- dlg.setState({ parseError: null,
- editValue: stringify ?
- pretty ? JSON.stringify(value, null, 2)
- : JSON.stringify(value) : value });
- dlg.show();
- } }>
- <i class="fas fa-edit text-secondary" />
- </button>
- ) ] } cardHeaderClass="card-header-sm">
- <WBJsonViewer app={ app } value={ value } stringify={ stringify }
- pretty={ pretty } />
- </WBAccordion>
- </div>
- );
- }
- }
-
- WBJsonEditor.defaultProps = {
- stringify: true,
- pretty: true,
- onChange: () => {}
- };
-
- export default WBJsonEditor;
|