@flexis/ui/components/CustomFlatSelect/CustomFlatSelectOption.js

Styleless React Components

"use strict";

var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");

var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");

_Object$defineProperty(exports, "__esModule", {
  value: true
});

exports.CustomFlatSelectOption = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));

var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/inherits"));

var _tslib = require("tslib");

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _helpers = require("../../helpers");

var _types = require("../common/types");

var _CustomFlatSelectSt = require("./CustomFlatSelect.st.css");

var _createElement = _react.default.createElement;
var PureComponent = _react.default.PureComponent;

var CustomFlatSelectOption =
/** @class */
function () {
  var CustomFlatSelectOption = /*#__PURE__*/function (_PureComponent) {
    (0, _inherits2.default)(CustomFlatSelectOption, _PureComponent);

    function CustomFlatSelectOption() {
      (0, _classCallCheck2.default)(this, CustomFlatSelectOption);
      return (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(CustomFlatSelectOption).apply(this, arguments));
    }

    (0, _createClass2.default)(CustomFlatSelectOption, [{
      key: "render",
      value: function render() {
        var _this$props = this.props,
            className = _this$props.className,
            optionId = _this$props.optionId,
            id = _this$props.id,
            type = _this$props.type,
            name = _this$props.name,
            value = _this$props.value,
            checked = _this$props.checked,
            disabled = _this$props.disabled,
            children = _this$props.children,
            props = (0, _objectWithoutProperties2.default)(_this$props, ["className", "optionId", "id", "type", "name", "value", "checked", "disabled", "children"]);
        return _createElement("li", (0, _extends2.default)({
          id: optionId,
          role: "option",
          "aria-selected": checked,
          "aria-disabled": disabled
        }, (0, _helpers.omit)(props, ['onChange']), {
          className: (0, _CustomFlatSelectSt.style)(_CustomFlatSelectSt.classes.option, className)
        }), _createElement("label", {
          className: _CustomFlatSelectSt.classes.label
        }, _createElement("input", {
          className: _CustomFlatSelectSt.classes.input,
          id: id,
          type: type,
          name: name,
          checked: checked,
          onChange: this.onChange,
          value: value,
          disabled: disabled
        }), _createElement("span", {
          className: _CustomFlatSelectSt.classes.face,
          onClick: this.onFaceClick
        }, children)));
      }
    }, {
      key: "onChange",
      value: function onChange(event) {
        var _this$props2 = this.props,
            onChange = _this$props2.onChange,
            value = _this$props2.value;

        if (typeof onChange === 'function') {
          onChange(value, event);
        }
      }
    }, {
      key: "onFaceClick",
      value: function onFaceClick(event) {
        var target = event.target,
            currentTarget = event.currentTarget;

        if (target === currentTarget) {
          return;
        }

        var input = currentTarget.previousElementSibling;
        input.click();
      }
    }]);
    return CustomFlatSelectOption;
  }(PureComponent);

  process.env.NODE_ENV !== "production" ? CustomFlatSelectOption.propTypes = {
    id: _propTypes.default.string,
    type: _propTypes.default.oneOf(['radio', 'checkbox']),
    name: _propTypes.default.string,
    onChange: _propTypes.default.func,
    value: _types.SelectValuePropType,
    checked: _propTypes.default.bool,
    disabled: _propTypes.default.bool,
    children: _propTypes.default.node.isRequired
  } : void 0;
  CustomFlatSelectOption.defaultProps = {
    checked: false,
    disabled: false
  };
  (0, _tslib.__decorate)([(0, _helpers.Bind)()], CustomFlatSelectOption.prototype, "onChange", null);
  return CustomFlatSelectOption;
}();

exports.CustomFlatSelectOption = CustomFlatSelectOption;
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0N1c3RvbUZsYXRTZWxlY3QvQ3VzdG9tRmxhdFNlbGVjdE9wdGlvbi50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUFBOztBQU9BOztBQUNBOztBQUtBOztBQUlBOzs7OztBQXNCQSxJQUFBLHNCQUFBO0FBQUE7QUFBQSxZQUFBO0FBQUEsTUFBYSxzQkFBYjtBQUFBOztBQUFBO0FBQUE7QUFBQTtBQUFBOztBQUFBO0FBQUE7QUFBQSwrQkFxQk87QUFBQSwwQkFhRCxLQUFLLEtBYko7QUFBQSxZQUdKLFNBSEksZUFHSixTQUhJO0FBQUEsWUFJSixRQUpJLGVBSUosUUFKSTtBQUFBLFlBS0osRUFMSSxlQUtKLEVBTEk7QUFBQSxZQU1KLElBTkksZUFNSixJQU5JO0FBQUEsWUFPSixJQVBJLGVBT0osSUFQSTtBQUFBLFlBUUosS0FSSSxlQVFKLEtBUkk7QUFBQSxZQVNKLE9BVEksZUFTSixPQVRJO0FBQUEsWUFVSixRQVZJLGVBVUosUUFWSTtBQUFBLFlBV0osUUFYSSxlQVdKLFFBWEk7QUFBQSxZQVlELEtBWkM7QUFlTCxlQUNDO0FBQ0MsVUFBQSxFQUFFLEVBQUUsUUFETDtBQUVDLFVBQUEsSUFBSSxFQUFDLFFBRk47QUFHQywyQkFBZSxPQUhoQjtBQUlDLDJCQUFlO0FBSmhCLFdBS0ssbUJBQUssS0FBTCxFQUFZLENBQUMsVUFBRCxDQUFaLENBTEw7QUFNQyxVQUFBLFNBQVMsRUFBRSwrQkFBTSw0QkFBUSxNQUFkLEVBQXNCLFNBQXRCO0FBTlosWUFRQztBQUNDLFVBQUEsU0FBUyxFQUFFLDRCQUFRO0FBRHBCLFdBR0M7QUFDQyxVQUFBLFNBQVMsRUFBRSw0QkFBUSxLQURwQjtBQUVDLFVBQUEsRUFBRSxFQUFFLEVBRkw7QUFHQyxVQUFBLElBQUksRUFBRSxJQUhQO0FBSUMsVUFBQSxJQUFJLEVBQUUsSUFKUDtBQUtDLFVBQUEsT0FBTyxFQUFFLE9BTFY7QUFNQyxVQUFBLFFBQVEsRUFBRSxLQUFLLFFBTmhCO0FBT0MsVUFBQSxLQUFLLEVBQUUsS0FQUjtBQVFDLFVBQUEsUUFBUSxFQUFFO0FBUlgsVUFIRCxFQWFDO0FBQ0MsVUFBQSxTQUFTLEVBQUUsNEJBQVEsSUFEcEI7QUFFQyxVQUFBLE9BQU8sRUFBRSxLQUFLO0FBRmYsV0FJRSxRQUpGLENBYkQsQ0FSRCxDQUREO0FBK0JBO0FBbkVGO0FBQUE7QUFBQSwrQkFzRWtCLEtBdEVsQixFQXNFb0M7QUFBQSwyQkFLOUIsS0FBSyxLQUx5QjtBQUFBLFlBR2pDLFFBSGlDLGdCQUdqQyxRQUhpQztBQUFBLFlBSWpDLEtBSmlDLGdCQUlqQyxLQUppQzs7QUFPbEMsWUFBSSxPQUFPLFFBQVAsS0FBb0IsVUFBeEIsRUFBb0M7QUFDbkMsVUFBQSxRQUFRLENBQ1AsS0FETyxFQUVQLEtBRk8sQ0FBUjtBQUlBO0FBQ0Q7QUFuRkY7QUFBQTtBQUFBLGtDQXFGcUIsS0FyRnJCLEVBcUZzQztBQUFBLFlBR25DLE1BSG1DLEdBS2hDLEtBTGdDLENBR25DLE1BSG1DO0FBQUEsWUFJbkMsYUFKbUMsR0FLaEMsS0FMZ0MsQ0FJbkMsYUFKbUM7O0FBT3BDLFlBQUksTUFBTSxLQUFLLGFBQWYsRUFBOEI7QUFDN0I7QUFDQTs7QUFFRCxZQUFNLEtBQUssR0FBRyxhQUFhLENBQUMsc0JBQTVCO0FBRUEsUUFBQSxLQUFLLENBQUMsS0FBTjtBQUNBO0FBbkdGO0FBQUE7QUFBQSxJQUE0QyxhQUE1Qzs7QUFFUSwwQ0FBQSxzQkFBQSxDQUFBLFNBQUEsR0FBWTtBQUNsQixJQUFBLEVBQUUsRUFBUSxtQkFBVSxNQURGO0FBRWxCLElBQUEsSUFBSSxFQUFNLG1CQUFVLEtBQVYsQ0FBZ0IsQ0FDekIsT0FEeUIsRUFFekIsVUFGeUIsQ0FBaEIsQ0FGUTtBQU1sQixJQUFBLElBQUksRUFBTSxtQkFBVSxNQU5GO0FBT2xCLElBQUEsUUFBUSxFQUFFLG1CQUFVLElBUEY7QUFRbEIsSUFBQSxLQUFLLEVBQUssMEJBUlE7QUFTbEIsSUFBQSxPQUFPLEVBQUcsbUJBQVUsSUFURjtBQVVsQixJQUFBLFFBQVEsRUFBRSxtQkFBVSxJQVZGO0FBV2xCLElBQUEsUUFBUSxFQUFFLG1CQUFVLElBQVYsQ0FBZTtBQVhQLEdBQVo7QUFjQSxFQUFBLHNCQUFBLENBQUEsWUFBQSxHQUFlO0FBQ3JCLElBQUEsT0FBTyxFQUFHLEtBRFc7QUFFckIsSUFBQSxRQUFRLEVBQUU7QUFGVyxHQUFmO0FBc0RQLHlCQUFBLENBREMsb0JBQ0QsQ0FBQSxFLGdDQUFBLEUsVUFBQSxFQWFDLElBYkQ7QUE4QkQsU0FBQSxzQkFBQTtBQUFDLENBcEdELEVBQUEiLCJzb3VyY2VSb290IjoiIn0=