@centreon/react-components
Version:
react components used by centreon web frontend
146 lines (114 loc) • 5.4 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 _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = _interopRequireDefault(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _swithcerInputField = _interopRequireDefault(require("./swithcer-input-field.scss"));
var _IconClose = _interopRequireDefault(require("../../Icon/IconClose"));
var _IconAction = _interopRequireDefault(require("../../Icon/IconAction"));
/* eslint-disable jsx-a11y/label-has-for */
/* eslint-disable jsx-a11y/label-has-associated-control */
/* eslint-disable react/jsx-filename-extension */
/* eslint-disable react/prop-types */
/* eslint-disable react/destructuring-assignment */
/* eslint-disable camelcase */
var SwitcherInputField =
/*#__PURE__*/
function (_React$Component) {
(0, _inherits2["default"])(SwitcherInputField, _React$Component);
function SwitcherInputField() {
var _getPrototypeOf2;
var _this;
(0, _classCallCheck2["default"])(this, SwitcherInputField);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = (0, _possibleConstructorReturn2["default"])(this, (_getPrototypeOf2 = (0, _getPrototypeOf3["default"])(SwitcherInputField)).call.apply(_getPrototypeOf2, [this].concat(args)));
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
value: true,
toggled: false
});
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "UNSAFE_componentDidMount", function () {
var value = _this.props.value;
if (value) {
_this.setState({
value: value
});
}
});
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "UNSAFE_componentWillReceiveProps", function (nextProps) {
var value = nextProps.value;
if (_this.state.value !== value) {
_this.setState({
toggled: !value,
value: value
});
}
});
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onChange", function () {
var _this$props = _this.props,
onChange = _this$props.onChange,
filterKey = _this$props.filterKey;
var _this$state = _this.state,
value = _this$state.value,
toggled = _this$state.toggled;
_this.setState({
value: !value,
toggled: !toggled
});
if (onChange) {
onChange(!value, filterKey);
}
});
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "toggled", function () {
var toggled = _this.state.toggled;
_this.setState({
toggled: !toggled
});
});
return _this;
}
(0, _createClass2["default"])(SwitcherInputField, [{
key: "render",
value: function render() {
var customClass = this.props.customClass;
var _this$state2 = this.state,
value = _this$state2.value,
toggled = _this$state2.toggled;
return _react["default"].createElement("div", {
className: (0, _classnames["default"])(_swithcerInputField["default"]['switcher-input'], _swithcerInputField["default"][customClass || ''])
}, _react["default"].createElement("label", {
className: (0, _classnames["default"])(_swithcerInputField["default"]["switch"], _swithcerInputField["default"][toggled ? 'switch-active' : 'switch-hide'])
}, _react["default"].createElement("input", {
type: "checkbox",
checked: !value,
onClick: this.onChange.bind(this)
}), _react["default"].createElement("span", {
className: (0, _classnames["default"])(_swithcerInputField["default"]['switch-slider'], _swithcerInputField["default"]['switch-round'])
}, _react["default"].createElement("span", {
className: (0, _classnames["default"])(_swithcerInputField["default"]['switcher-icon-left'])
}, _react["default"].createElement(_IconClose["default"], {
customStyle: "icon-close-custom",
iconType: "small"
})), _react["default"].createElement("span", {
className: (0, _classnames["default"])(_swithcerInputField["default"]['switcher-icon-right'])
}, _react["default"].createElement(_IconAction["default"], {
customStyle: "icon-action-custom",
iconActionType: "check"
})))));
}
}]);
return SwitcherInputField;
}(_react["default"].Component);
var _default = SwitcherInputField;
exports["default"] = _default;