@iobroker/adapter-react
Version:
React classes to develop admin interfaces for ioBroker with react.
173 lines (138 loc) • 7.23 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _withWidth = _interopRequireDefault(require("@material-ui/core/withWidth"));
var _styles = require("@material-ui/core/styles");
var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
var _TextField = _interopRequireDefault(require("@material-ui/core/TextField"));
var _Dialog = _interopRequireDefault(require("@material-ui/core/Dialog"));
var _DialogActions = _interopRequireDefault(require("@material-ui/core/DialogActions"));
var _DialogContent = _interopRequireDefault(require("@material-ui/core/DialogContent"));
var _DialogContentText = _interopRequireDefault(require("@material-ui/core/DialogContentText"));
var _DialogTitle = _interopRequireDefault(require("@material-ui/core/DialogTitle"));
var _i18n = _interopRequireDefault(require("../i18n"));
var _Close = _interopRequireDefault(require("@material-ui/icons/Close"));
var _Check = _interopRequireDefault(require("@material-ui/icons/Check"));
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
/**
* @typedef {object} TextInputProps
* @property {string} [key] The key to identify this component.
* @property {(text: string | null) => void} onClose The dialog close callback.
* @property {string} titleText The title text.
* @property {string} [promptText] Prompt text (default: empty).
* @property {string} [labelText] Label text (default: empty).
* @property {string} cancelText The text of the cancel button.
* @property {string} applyText The text of the apply button.
* @property {(text: string) => string} [verify] The verification callback. Return a non-empty string if there was an error.
* @property {(text: string) => string} [rule] The text replacement callback.
* @property {'text' | 'number' | 'password' | 'email'} [type] The type of the textbox (default: text).
* @property {string} [input] The input when opening the dialog.
*
* @extends {React.Component<TextInputProps>}
*/
var TextInput = /*#__PURE__*/function (_React$Component) {
(0, _inherits2["default"])(TextInput, _React$Component);
var _super = _createSuper(TextInput);
/**
* @param {Readonly<TextInputProps>} props
*/
function TextInput(props) {
var _this;
(0, _classCallCheck2["default"])(this, TextInput);
_this = _super.call(this, props);
_this.state = {
text: _this.props.input || _this.props.value || '',
// input is deprecated
error: ''
};
return _this;
}
(0, _createClass2["default"])(TextInput, [{
key: "render",
value: function render() {
var _this2 = this;
return /*#__PURE__*/_react["default"].createElement(_Dialog["default"], {
open: true,
onClose: function onClose() {
return _this2.props.onClose(null);
},
"aria-labelledby": "form-dialog-title"
}, /*#__PURE__*/_react["default"].createElement(_DialogTitle["default"], {
id: "form-dialog-title"
}, this.props.titleText), /*#__PURE__*/_react["default"].createElement(_DialogContent["default"], null, /*#__PURE__*/_react["default"].createElement(_DialogContentText["default"], null, this.props.promptText), /*#__PURE__*/_react["default"].createElement(_TextField["default"], {
autoFocus: true,
margin: "dense",
error: !!this.state.error,
title: this.state.error,
value: this.state.text,
label: this.props.labelText || '',
type: this.props.type || 'text',
onKeyPress: function onKeyPress(e) {
return e.charCode === 13 && _this2.state.text && _this2.props.onClose(_this2.state.text);
},
onChange: function onChange(e) {
var error = '';
if (_this2.props.verify) {
error = !_this2.props.verify(e.target.value);
}
if (_this2.props.rule) {
_this2.setState({
text: _this2.props.rule(e.target.value),
error: error
});
} else {
_this2.setState({
text: e.target.value,
error: error
});
}
},
fullWidth: true
})), /*#__PURE__*/_react["default"].createElement(_DialogActions["default"], null, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
variant: "contained",
disabled: !this.state.text || this.state.error,
onClick: function onClick() {
return _this2.props.onClose(_this2.state.text);
},
color: "primary",
startIcon: /*#__PURE__*/_react["default"].createElement(_Check["default"], null)
}, this.props.applyText || _i18n["default"].t('ra_Ok')), /*#__PURE__*/_react["default"].createElement(_Button["default"], {
variant: "contained",
onClick: function onClick() {
return _this2.props.onClose(null);
},
startIcon: /*#__PURE__*/_react["default"].createElement(_Close["default"], null)
}, this.props.cancelText)));
}
}]);
return TextInput;
}(_react["default"].Component);
TextInput.propTypes = {
onClose: _propTypes["default"].func.isRequired,
titleText: _propTypes["default"].string.isRequired,
promptText: _propTypes["default"].string,
labelText: _propTypes["default"].string,
cancelText: _propTypes["default"].string,
applyText: _propTypes["default"].string,
verify: _propTypes["default"].func,
replace: _propTypes["default"].func,
type: _propTypes["default"].string,
// text, number, password, email
value: _propTypes["default"].string
};
/** @type {typeof TextInput} */
var _export = (0, _withWidth["default"])()(TextInput);
var _default = _export;
exports["default"] = _default;
//# sourceMappingURL=TextInput.js.map