react-editable-json-tree
Version:
React Editable Json Tree
415 lines (374 loc) • 18.1 kB
JavaScript
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require('babel-runtime/helpers/createClass');
var _createClass3 = _interopRequireDefault(_createClass2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);
var _JsonValue = require('./JsonValue');
var _JsonValue2 = _interopRequireDefault(_JsonValue);
var _JsonObject = require('./JsonObject');
var _JsonObject2 = _interopRequireDefault(_JsonObject);
var _JsonArray = require('./JsonArray');
var _JsonArray2 = _interopRequireDefault(_JsonArray);
var _JsonFunctionValue = require('./JsonFunctionValue');
var _JsonFunctionValue2 = _interopRequireDefault(_JsonFunctionValue);
var _objectTypes = require('../utils/objectTypes');
var _dataTypes = require('../types/dataTypes');
var _dataTypes2 = _interopRequireDefault(_dataTypes);
var _parse = require('../utils/parse');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/* ************************************* */
/* ******** VARIABLES ******** */
/* ************************************* */
// Prop types
var propTypes = {
name: _propTypes2.default.string.isRequired,
data: _propTypes2.default.any,
isCollapsed: _propTypes2.default.func.isRequired,
keyPath: _propTypes2.default.array,
deep: _propTypes2.default.number,
handleRemove: _propTypes2.default.func,
handleUpdateValue: _propTypes2.default.func,
onUpdate: _propTypes2.default.func.isRequired,
onDeltaUpdate: _propTypes2.default.func.isRequired,
readOnly: _propTypes2.default.func.isRequired,
getStyle: _propTypes2.default.func.isRequired,
addButtonElement: _propTypes2.default.element,
cancelButtonElement: _propTypes2.default.element,
editButtonElement: _propTypes2.default.element,
inputElementGenerator: _propTypes2.default.func.isRequired,
textareaElementGenerator: _propTypes2.default.func.isRequired,
minusMenuElement: _propTypes2.default.element,
plusMenuElement: _propTypes2.default.element,
beforeRemoveAction: _propTypes2.default.func,
beforeAddAction: _propTypes2.default.func,
beforeUpdateAction: _propTypes2.default.func,
logger: _propTypes2.default.object.isRequired,
onSubmitValueParser: _propTypes2.default.func.isRequired
};
// Default props
/*
* Author: Alexandre Havrileck (Oxyno-zeta)
* Date: 20/10/16
* Licence: See Readme
*/
/* ************************************* */
/* ******** IMPORTS ******** */
/* ************************************* */
var defaultProps = {
keyPath: [],
deep: 0
};
/* ************************************* */
/* ******** COMPONENT ******** */
/* ************************************* */
var JsonNode = function (_Component) {
(0, _inherits3.default)(JsonNode, _Component);
function JsonNode(props) {
(0, _classCallCheck3.default)(this, JsonNode);
var _this = (0, _possibleConstructorReturn3.default)(this, (JsonNode.__proto__ || (0, _getPrototypeOf2.default)(JsonNode)).call(this, props));
_this.state = {
data: props.data,
name: props.name,
keyPath: props.keyPath,
deep: props.deep
};
return _this;
}
(0, _createClass3.default)(JsonNode, [{
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
this.setState({
data: nextProps.data
});
}
}, {
key: 'render',
value: function render() {
var _state = this.state,
data = _state.data,
name = _state.name,
keyPath = _state.keyPath,
deep = _state.deep;
var _props = this.props,
isCollapsed = _props.isCollapsed,
handleRemove = _props.handleRemove,
handleUpdateValue = _props.handleUpdateValue,
onUpdate = _props.onUpdate,
onDeltaUpdate = _props.onDeltaUpdate,
readOnly = _props.readOnly,
getStyle = _props.getStyle,
addButtonElement = _props.addButtonElement,
cancelButtonElement = _props.cancelButtonElement,
editButtonElement = _props.editButtonElement,
inputElementGenerator = _props.inputElementGenerator,
textareaElementGenerator = _props.textareaElementGenerator,
minusMenuElement = _props.minusMenuElement,
plusMenuElement = _props.plusMenuElement,
beforeRemoveAction = _props.beforeRemoveAction,
beforeAddAction = _props.beforeAddAction,
beforeUpdateAction = _props.beforeUpdateAction,
logger = _props.logger,
onSubmitValueParser = _props.onSubmitValueParser;
var readOnlyTrue = function readOnlyTrue() {
return true;
};
var dataType = (0, _objectTypes.getObjectType)(data);
switch (dataType) {
case _dataTypes2.default.ERROR:
return _react2.default.createElement(_JsonObject2.default, {
data: data,
name: name,
isCollapsed: isCollapsed,
keyPath: keyPath,
deep: deep,
handleRemove: handleRemove,
onUpdate: onUpdate,
onDeltaUpdate: onDeltaUpdate,
readOnly: readOnlyTrue,
dataType: dataType,
getStyle: getStyle,
addButtonElement: addButtonElement,
cancelButtonElement: cancelButtonElement,
editButtonElement: editButtonElement,
inputElementGenerator: inputElementGenerator,
textareaElementGenerator: textareaElementGenerator,
minusMenuElement: minusMenuElement,
plusMenuElement: plusMenuElement,
beforeRemoveAction: beforeRemoveAction,
beforeAddAction: beforeAddAction,
beforeUpdateAction: beforeUpdateAction,
logger: logger,
onSubmitValueParser: onSubmitValueParser
});
case _dataTypes2.default.OBJECT:
return _react2.default.createElement(_JsonObject2.default, {
data: data,
name: name,
isCollapsed: isCollapsed,
keyPath: keyPath,
deep: deep,
handleRemove: handleRemove,
onUpdate: onUpdate,
onDeltaUpdate: onDeltaUpdate,
readOnly: readOnly,
dataType: dataType,
getStyle: getStyle,
addButtonElement: addButtonElement,
cancelButtonElement: cancelButtonElement,
editButtonElement: editButtonElement,
inputElementGenerator: inputElementGenerator,
textareaElementGenerator: textareaElementGenerator,
minusMenuElement: minusMenuElement,
plusMenuElement: plusMenuElement,
beforeRemoveAction: beforeRemoveAction,
beforeAddAction: beforeAddAction,
beforeUpdateAction: beforeUpdateAction,
logger: logger,
onSubmitValueParser: onSubmitValueParser
});
case _dataTypes2.default.ARRAY:
return _react2.default.createElement(_JsonArray2.default, {
data: data,
name: name,
isCollapsed: isCollapsed,
keyPath: keyPath,
deep: deep,
handleRemove: handleRemove,
onUpdate: onUpdate,
onDeltaUpdate: onDeltaUpdate,
readOnly: readOnly,
dataType: dataType,
getStyle: getStyle,
addButtonElement: addButtonElement,
cancelButtonElement: cancelButtonElement,
editButtonElement: editButtonElement,
inputElementGenerator: inputElementGenerator,
textareaElementGenerator: textareaElementGenerator,
minusMenuElement: minusMenuElement,
plusMenuElement: plusMenuElement,
beforeRemoveAction: beforeRemoveAction,
beforeAddAction: beforeAddAction,
beforeUpdateAction: beforeUpdateAction,
logger: logger,
onSubmitValueParser: onSubmitValueParser
});
case _dataTypes2.default.STRING:
return _react2.default.createElement(_JsonValue2.default, {
name: name,
value: '"' + data + '"',
originalValue: data,
keyPath: keyPath,
deep: deep,
handleRemove: handleRemove,
handleUpdateValue: handleUpdateValue,
readOnly: readOnly,
dataType: dataType,
getStyle: getStyle,
cancelButtonElement: cancelButtonElement,
editButtonElement: editButtonElement,
inputElementGenerator: inputElementGenerator,
minusMenuElement: minusMenuElement,
logger: logger,
onSubmitValueParser: onSubmitValueParser
});
case _dataTypes2.default.NUMBER:
return _react2.default.createElement(_JsonValue2.default, {
name: name,
value: data,
originalValue: data,
keyPath: keyPath,
deep: deep,
handleRemove: handleRemove,
handleUpdateValue: handleUpdateValue,
readOnly: readOnly,
dataType: dataType,
getStyle: getStyle,
cancelButtonElement: cancelButtonElement,
editButtonElement: editButtonElement,
inputElementGenerator: inputElementGenerator,
minusMenuElement: minusMenuElement,
logger: logger,
onSubmitValueParser: onSubmitValueParser
});
case _dataTypes2.default.BOOLEAN:
return _react2.default.createElement(_JsonValue2.default, {
name: name,
value: data ? 'true' : 'false',
originalValue: data,
keyPath: keyPath,
deep: deep,
handleRemove: handleRemove,
handleUpdateValue: handleUpdateValue,
readOnly: readOnly,
dataType: dataType,
getStyle: getStyle,
cancelButtonElement: cancelButtonElement,
editButtonElement: editButtonElement,
inputElementGenerator: inputElementGenerator,
minusMenuElement: minusMenuElement,
logger: logger,
onSubmitValueParser: onSubmitValueParser
});
case _dataTypes2.default.DATE:
return _react2.default.createElement(_JsonValue2.default, {
name: name,
value: data.toISOString(),
originalValue: data,
keyPath: keyPath,
deep: deep,
handleRemove: handleRemove,
handleUpdateValue: handleUpdateValue,
readOnly: readOnlyTrue,
dataType: dataType,
getStyle: getStyle,
cancelButtonElement: cancelButtonElement,
editButtonElement: editButtonElement,
inputElementGenerator: inputElementGenerator,
minusMenuElement: minusMenuElement,
logger: logger,
onSubmitValueParser: onSubmitValueParser
});
case _dataTypes2.default.NULL:
return _react2.default.createElement(_JsonValue2.default, {
name: name,
value: 'null',
originalValue: 'null',
keyPath: keyPath,
deep: deep,
handleRemove: handleRemove,
handleUpdateValue: handleUpdateValue,
readOnly: readOnly,
dataType: dataType,
getStyle: getStyle,
cancelButtonElement: cancelButtonElement,
editButtonElement: editButtonElement,
inputElementGenerator: inputElementGenerator,
minusMenuElement: minusMenuElement,
logger: logger,
onSubmitValueParser: onSubmitValueParser
});
case _dataTypes2.default.UNDEFINED:
return _react2.default.createElement(_JsonValue2.default, {
name: name,
value: 'undefined',
originalValue: 'undefined',
keyPath: keyPath,
deep: deep,
handleRemove: handleRemove,
handleUpdateValue: handleUpdateValue,
readOnly: readOnly,
dataType: dataType,
getStyle: getStyle,
cancelButtonElement: cancelButtonElement,
editButtonElement: editButtonElement,
inputElementGenerator: inputElementGenerator,
minusMenuElement: minusMenuElement,
logger: logger,
onSubmitValueParser: onSubmitValueParser
});
case _dataTypes2.default.FUNCTION:
return _react2.default.createElement(_JsonFunctionValue2.default, {
name: name,
value: (0, _parse.functionToString)(data),
originalValue: data,
keyPath: keyPath,
deep: deep,
handleRemove: handleRemove,
handleUpdateValue: handleUpdateValue,
readOnly: readOnly,
dataType: dataType,
getStyle: getStyle,
cancelButtonElement: cancelButtonElement,
editButtonElement: editButtonElement,
textareaElementGenerator: textareaElementGenerator,
minusMenuElement: minusMenuElement,
logger: logger,
onSubmitValueParser: onSubmitValueParser
});
case _dataTypes2.default.SYMBOL:
return _react2.default.createElement(_JsonValue2.default, {
name: name,
value: data.toString(),
originalValue: data,
keyPath: keyPath,
deep: deep,
handleRemove: handleRemove,
handleUpdateValue: handleUpdateValue,
readOnly: readOnlyTrue,
dataType: dataType,
getStyle: getStyle,
cancelButtonElement: cancelButtonElement,
editButtonElement: editButtonElement,
inputElementGenerator: inputElementGenerator,
minusMenuElement: minusMenuElement,
logger: logger,
onSubmitValueParser: onSubmitValueParser
});
default:
return null;
}
}
}]);
return JsonNode;
}(_react.Component);
// Add prop types
JsonNode.propTypes = propTypes;
// Add default props
JsonNode.defaultProps = defaultProps;
/* ************************************* */
/* ******** EXPORTS ******** */
/* ************************************* */
exports.default = JsonNode;