@flexis/ui/components/Button/Button.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.default = void 0;

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

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

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 _react = _interopRequireDefault(require("react"));

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

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

var _ButtonSt = require("./Button.st.css");

var _createElement = _react.default.createElement;
var PureComponent = _react.default.PureComponent,
    Children = _react.default.Children,
    cloneElement = _react.default.cloneElement;

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

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

    (0, _createClass2.default)(Button, [{
      key: "render",
      value: function render() {
        var _this$props = this.props,
            className = _this$props.className,
            elementRef = _this$props.elementRef,
            icon = _this$props.icon,
            flexIcon = _this$props.flexIcon,
            alignIcon = _this$props.alignIcon,
            children = _this$props.children,
            props = (0, _objectWithoutProperties2.default)(_this$props, ["className", "elementRef", "icon", "flexIcon", "alignIcon", "children"]);
        var iconOnly = !Children.count(children);
        var leftAligned = alignIcon === _types.AlignSideVariant.Left;
        var buttonIcon = null;

        if (typeof icon !== 'undefined') {
          buttonIcon = cloneElement(icon, {
            className: (0, _ButtonSt.style)(_ButtonSt.classes.icon, (0, _defineProperty2.default)({}, "".concat(alignIcon, "Align"), Boolean(alignIcon) && !iconOnly), icon.props.className)
          });
        }

        return _createElement("button", (0, _extends2.default)({
          ref: elementRef
        }, props, {
          className: (0, _ButtonSt.style)(_ButtonSt.classes.root, {
            withIcon: Boolean(buttonIcon),
            flexIcon: flexIcon
          }, className)
        }), buttonIcon ? _createElement("div", {
          className: _ButtonSt.classes.iconContainer
        }, leftAligned && buttonIcon, !iconOnly && _createElement("span", null, children), !leftAligned && buttonIcon) : children);
      }
    }]);
    return Button;
  }(PureComponent);

  process.env.NODE_ENV !== "production" ? Button.propTypes = {
    elementRef: _propTypes.default.func,
    icon: _propTypes.default.element,
    flexIcon: _propTypes.default.bool,
    alignIcon: _propTypes.default.oneOf(_types.AlignSideValues),
    children: _propTypes.default.node
  } : void 0;
  Button.defaultProps = {
    flexIcon: false,
    alignIcon: _types.AlignSideVariant.Left
  };
  return Button;
}();

var _default = Button;
exports.default = _default;
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0J1dHRvbi9CdXR0b24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFBQTs7QUFTQTs7QUFJQTs7QUFLQTs7Ozs7OztBQWtCQSxJQUFBLE1BQUE7QUFBQTtBQUFBLFlBQUE7QUFBQSxNQUFxQixNQUFyQjtBQUFBOztBQUFBO0FBQUE7QUFBQTtBQUFBOztBQUFBO0FBQUE7QUFBQSwrQkFlTztBQUFBLDBCQVVELEtBQUssS0FWSjtBQUFBLFlBR0osU0FISSxlQUdKLFNBSEk7QUFBQSxZQUlKLFVBSkksZUFJSixVQUpJO0FBQUEsWUFLSixJQUxJLGVBS0osSUFMSTtBQUFBLFlBTUosUUFOSSxlQU1KLFFBTkk7QUFBQSxZQU9KLFNBUEksZUFPSixTQVBJO0FBQUEsWUFRSixRQVJJLGVBUUosUUFSSTtBQUFBLFlBU0QsS0FUQztBQVdMLFlBQU0sUUFBUSxHQUFHLENBQUMsUUFBUSxDQUFDLEtBQVQsQ0FBZSxRQUFmLENBQWxCO0FBQ0EsWUFBTSxXQUFXLEdBQUcsU0FBUyxLQUFLLHdCQUFpQixJQUFuRDtBQUNBLFlBQUksVUFBVSxHQUFzQixJQUFwQzs7QUFFQSxZQUFJLE9BQU8sSUFBUCxLQUFnQixXQUFwQixFQUFpQztBQUNoQyxVQUFBLFVBQVUsR0FBRyxZQUFZLENBQ3hCLElBRHdCLEVBRXhCO0FBQ0MsWUFBQSxTQUFTLEVBQUUscUJBQU0sa0JBQVEsSUFBZCw4Q0FDTixTQURNLFlBQ2EsT0FBTyxDQUFDLFNBQUQsQ0FBUCxJQUFzQixDQUFDLFFBRHBDLEdBRVIsSUFBSSxDQUFDLEtBQUwsQ0FBVyxTQUZIO0FBRFosV0FGd0IsQ0FBekI7QUFRQTs7QUFFRCxlQUNDO0FBQ0MsVUFBQSxHQUFHLEVBQUU7QUFETixXQUVLLEtBRkw7QUFHQyxVQUFBLFNBQVMsRUFBRSxxQkFBTSxrQkFBUSxJQUFkLEVBQW9CO0FBQzlCLFlBQUEsUUFBUSxFQUFFLE9BQU8sQ0FBQyxVQUFELENBRGE7QUFFOUIsWUFBQSxRQUFRLEVBQVI7QUFGOEIsV0FBcEIsRUFHUixTQUhRO0FBSFosWUFRRSxVQUFVLEdBQ1Y7QUFDQyxVQUFBLFNBQVMsRUFBRSxrQkFBUTtBQURwQixXQUdFLFdBQVcsSUFBSSxVQUhqQixFQUlFLENBQUMsUUFBRCxJQUNBLDZCQUFPLFFBQVAsQ0FMRixFQU9FLENBQUMsV0FBRCxJQUFnQixVQVBsQixDQURVLEdBVVAsUUFsQkwsQ0FERDtBQXNCQTtBQS9ERjtBQUFBO0FBQUEsSUFBb0MsYUFBcEM7O0FBRVEsMENBQUEsTUFBQSxDQUFBLFNBQUEsR0FBWTtBQUNsQixJQUFBLFVBQVUsRUFBRSxtQkFBVSxJQURKO0FBRWxCLElBQUEsSUFBSSxFQUFRLG1CQUFVLE9BRko7QUFHbEIsSUFBQSxRQUFRLEVBQUksbUJBQVUsSUFISjtBQUlsQixJQUFBLFNBQVMsRUFBRyxtQkFBVSxLQUFWLENBQWdCLHNCQUFoQixDQUpNO0FBS2xCLElBQUEsUUFBUSxFQUFJLG1CQUFVO0FBTEosR0FBWjtBQVFBLEVBQUEsTUFBQSxDQUFBLFlBQUEsR0FBZTtBQUNyQixJQUFBLFFBQVEsRUFBSSxLQURTO0FBRXJCLElBQUEsU0FBUyxFQUFHLHdCQUFpQjtBQUZSLEdBQWY7QUFzRFIsU0FBQSxNQUFBO0FBQUMsQ0FoRUQsRUFBQTs7ZUFBcUIsTSIsInNvdXJjZVJvb3QiOiIifQ==