alm-search-01/dist/ButtonField.js

This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

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

var _Button = _interopRequireDefault(require("@material-ui/core/Button"));

var _styles = require("@material-ui/core/styles");

var _Error = _interopRequireDefault(require("@material-ui/icons/Error"));

var _brandStyles = _interopRequireDefault(require("./utils/brandStyles"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }

function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }

function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }

function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }

var useStyles = (0, _styles.makeStyles)(function (theme) {
  return {
    iconContainer: {
      display: 'flex',
      alignItems: 'center',
      justifyContent: 'center',
      marginLeft: 4,
      marginRight: 12
    },
    button: {
      flex: '1',
      padding: '7px 11px',
      background: function background(getBrandStyles) {
        return getBrandStyles.inputBgColor;
      },
      borderRadius: '4px',
      border: '0',
      minHeight: '55px',
      textTransform: 'capitalize',
      display: 'block',
      margin: '0 4px',
      textAlign: 'left',
      position: 'relative',
      '&:hover': {
        border: '0',
        background: function background(getBrandStyles) {
          return getBrandStyles.inputBgColor;
        }
      }
    },
    errorContainer: {
      color: '#ef4050',
      position: 'absolute',
      right: '10px',
      left: 'auto',
      top: 16,
      zIndex: 10
    },
    icon: {
      color: function color(getBrandStyles) {
        return getBrandStyles.iconColor;
      },
      fontSize: 24,
      margin: '0',
      position: 'static',
      padding: '0'
    },
    labelText: {
      color: function color(getBrandStyles) {
        return getBrandStyles.labelColor;
      },
      fontSize: '12px',
      fontWeight: 'normal',
      overflow: 'hidden',
      textOverflow: 'ellipsis',
      whiteSpace: 'nowrap',
      display: 'block',
      background: 'transparent',
      textAlign: 'initial',
      padding: '0'
    },
    labelValue: {
      color: '#333333',
      fontSize: '14px',
      fontWeight: 'normal',
      overflow: 'hidden',
      textOverflow: 'ellipsis',
      whiteSpace: 'nowrap'
    },
    //RTL
    iconContainerRtl: {
      marginLeft: 12,
      marginRight: 4
    },
    textRtl: {
      textAlign: 'right'
    },
    errorContainerRtl: {
      right: 'auto',
      left: '10px'
    }
  };
});

function ButtonField(_ref) {
  var label = _ref.label,
      value = _ref.value,
      children = _ref.children,
      required = _ref.required,
      IconComponent = _ref.iconComponent,
      apiCall = _ref.apiCall,
      type = _ref.type,
      lang = _ref.lang,
      brand = _ref.brand;

  var _React$useState = _react.default.useState(false),
      _React$useState2 = _slicedToArray(_React$useState, 2),
      open = _React$useState2[0],
      setOpen = _React$useState2[1];

  var anchorRef = _react.default.useRef(null);

  var classes = useStyles((0, _brandStyles.default)(brand));
  var ar = "ar";

  var handleClickOpen = function handleClickOpen() {
    setOpen(true);

    if (type === 'departure' || type === 'arrival') {
      apiCall();
    }
  };

  var handleClose = function handleClose() {
    setOpen(false);
  };

  return _react.default.createElement(_react.default.Fragment, null, IconComponent ? _react.default.createElement("div", {
    className: "".concat(classes.iconContainer, " ").concat(lang === ar && classes.iconContainerRtl)
  }, _react.default.createElement(IconComponent, {
    classes: {
      root: classes.icon
    },
    color: "primary"
  })) : null, _react.default.createElement(_Button.default, {
    classes: {
      root: "".concat(classes.button, " ").concat(lang === ar && classes.textRtl)
    },
    ref: anchorRef,
    onClick: handleClickOpen,
    variant: "outlined",
    color: "primary"
  }, _react.default.createElement("div", {
    className: classes.labelText
  }, label), value ? _react.default.createElement("div", {
    className: "".concat(classes.labelValue, " ").concat(lang === ar && classes.textRtl)
  }, value) : null, required && _react.default.createElement("div", {
    className: "".concat(classes.errorContainer, " ").concat(lang === ar && classes.errorContainerRtl)
  }, _react.default.createElement(_Error.default, null))), children(open, handleClose, anchorRef));
}

var _default = ButtonField;
exports.default = _default;