@iobroker/adapter-react
Version:
React classes to develop admin interfaces for ioBroker with react.
201 lines (160 loc) • 8.39 kB
JavaScript
"use strict";
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 _withStyles = _interopRequireDefault(require("@material-ui/core/styles/withStyles"));
var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
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 _FormControlLabel = _interopRequireDefault(require("@material-ui/core/FormControlLabel"));
var _Checkbox = _interopRequireDefault(require("@material-ui/core/Checkbox"));
var _Check = _interopRequireDefault(require("@material-ui/icons/Check"));
var _Close = _interopRequireDefault(require("@material-ui/icons/Close"));
var _i18n = _interopRequireDefault(require("../i18n"));
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; } }
var styles = {
suppress: {
fontSize: 12
},
suppressRoot: {
marginTop: 16
}
};
/**
* @typedef {object} DialogConfirmProps
* @property {string} [key] The key to identify this component.
* @property {string} [title] The dialog title; default: Are you sure? (translated)
* @property {string} text The dialog text.
* @property {string} [ok] The ok button text; default: OK (translated)
* @property {string} [cancel] The cancel button text; default: Cancel (translated)
* @property {string} [suppressQuestionMinutes] interval in minutes for which the confirm dialog will be suppressed if activated.
* @property {string} [suppressText] The suppress checkbox text; default: Suppress question for next %s minutes (translated)
* @property {string} [dialogName] Name of the dialog. Used only with suppressQuestionMinutes to store the user choice
* @property {(ok: boolean) => void} [onClose] Close handler.
*
* @extends {React.Component<DialogConfirmProps>}
*/
var DialogConfirm = /*#__PURE__*/function (_React$Component) {
(0, _inherits2["default"])(DialogConfirm, _React$Component);
var _super = _createSuper(DialogConfirm);
function DialogConfirm(props) {
var _this;
(0, _classCallCheck2["default"])(this, DialogConfirm);
_this = _super.call(this, props);
if (!_this.props.dialogName && _this.props.suppressQuestionMinutes) {
throw new Error('dialogName required if suppressQuestionMinutes used');
}
var suppress = false;
if (_this.props.suppressQuestionMinutes) {
suppress = parseInt(window.localStorage.getItem(_this.props.dialogName), 10) || 0;
if (!suppress) {
suppress = false;
} else if (Date.now() > suppress) {
window.localStorage.removeItem(_this.props.dialogName);
suppress = false;
}
}
_this.state = {
suppress: suppress
};
return _this;
}
(0, _createClass2["default"])(DialogConfirm, [{
key: "handleOk",
value: function handleOk() {
if (this.state.suppress) {
window.localStorage.setItem(this.props.dialogName, Date.now() + this.props.suppressQuestionMinutes * 60000);
}
this.props.onClose && this.props.onClose(true);
}
}, {
key: "handleCancel",
value: function handleCancel() {
this.props.onClose && this.props.onClose(false);
}
}, {
key: "render",
value: function render() {
var _this2 = this;
if (typeof this.state.suppress === 'number') {
setTimeout(function () {
return _this2.props.onClose && _this2.props.onClose(true);
}, 100);
return null;
}
return /*#__PURE__*/_react["default"].createElement(_Dialog["default"], {
open: true,
maxWidth: "md",
fullWidth: true,
onClose: function onClose(event, reason) {
if (reason !== 'backdropClick' && reason !== 'escapeKeyDown') {
_this2.handleCancel();
}
},
"aria-labelledby": "confirmation-dialog-title",
"aria-describedby": "confirmation-dialog-description"
}, /*#__PURE__*/_react["default"].createElement(_DialogTitle["default"], {
id: "confirmation-dialog-title"
}, this.props.title || _i18n["default"].t('ra_Are you sure?')), /*#__PURE__*/_react["default"].createElement(_DialogContent["default"], null, /*#__PURE__*/_react["default"].createElement(_DialogContentText["default"], {
id: "confirmation-dialog-description"
}, this.props.icon || null, this.props.text, this.props.suppressQuestionMinutes ? /*#__PURE__*/_react["default"].createElement("br", null) : null, this.props.suppressQuestionMinutes ? /*#__PURE__*/_react["default"].createElement(_FormControlLabel["default"], {
classes: {
label: this.props.classes.suppress,
root: this.props.classes.suppressRoot
},
control: /*#__PURE__*/_react["default"].createElement(_Checkbox["default"], {
checked: !!this.state.suppress,
onChange: function onChange() {
return _this2.setState({
suppress: !_this2.state.suppress
});
}
}),
label: this.props.suppressText || _i18n["default"].t('ra_Suppress question for next %s minutes', this.props.suppressQuestionMinutes)
}) : null)), /*#__PURE__*/_react["default"].createElement(_DialogActions["default"], null, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
variant: "contained",
onClick: function onClick() {
return _this2.handleOk();
},
color: "primary",
autoFocus: true,
startIcon: /*#__PURE__*/_react["default"].createElement(_Check["default"], null)
}, this.props.ok || _i18n["default"].t('ra_Ok')), /*#__PURE__*/_react["default"].createElement(_Button["default"], {
variant: "contained",
onClick: function onClick() {
return _this2.handleCancel();
},
startIcon: /*#__PURE__*/_react["default"].createElement(_Close["default"], null)
}, this.props.cancel || _i18n["default"].t('ra_Cancel'))));
}
}]);
return DialogConfirm;
}(_react["default"].Component);
DialogConfirm.propTypes = {
onClose: _propTypes["default"].func.isRequired,
title: _propTypes["default"].string,
text: _propTypes["default"].string,
ok: _propTypes["default"].string,
cancel: _propTypes["default"].string,
icon: _propTypes["default"].object,
suppressQuestionMinutes: _propTypes["default"].number,
suppressText: _propTypes["default"].string,
dialogName: _propTypes["default"].string
};
var _export = (0, _withStyles["default"])(styles)(DialogConfirm);
var _default = _export;
exports["default"] = _default;
//# sourceMappingURL=Confirm.js.map