"use strict";

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

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

var _reactNative = require("react-native");

var _Colors = _interopRequireDefault(require("./Colors"));

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

const arrowRight = require('./Image/arrowRight.png');

const SquareRadio = ({
  data,
  style,
  selectedvalue,
  numberOfRecord,
  selected,
  labelStyle,
  rightArrow,
  isSelector,
  selectorLabel,
  onSelectorPress,
  isFullValue,
  maxWidth,
  gap,
  disabled,
  isDisplayName
}) => {
  console.log("selected " + JSON.stringify(selectedvalue)); //TO CALCULATE THE RIGHT MARGIN
  //THIS IS REQUIRED BECAUSE WE DONT HAVE `GAP` PROPERTY SUPPORTED IN REACT NATIVE

  const calculateMarginRight = index => {
    if (index === data.length - 1) {
      if (isSelector) return false;else return true;
    }

    if ((index + 1) % numberOfRecord === 0) {
      return true;
    } else return false;
  }; //CALCULATE THE WIDTH OF EACH ITEM DEPENDS OF NUMBER OF ITEMS IN ROW


  const calculateWidth = () => {
    switch (numberOfRecord) {
      case 1:
        return '100%';

      case 2:
        return '40%';

      case 3:
        return '25%';

      default:
        return '100%';
    }
  }; //TO CALCULATE TOP MARGIN,  TOP MARGIN WHEN THERE ARE TWO OR MORE ROWS


  const calculateMarginTop = index => {
    if (index < numberOfRecord) return 0;else return 16;
  };

  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
    style: [styles.container, style]
  }, data.map((item, index) => {
    return /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
      key: item.id,
      disabled: disabled,
      onPress: () => selected(isFullValue ? item : item.id),
      style: {
        marginRight: calculateMarginRight(index) ? 0 : gap || 33,
        flex: 1,
        minWidth: calculateWidth(),
        maxWidth: maxWidth ? '45%' : null // maxWidth: calculateWidth()

      }
    }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
      style: [styles.button, {
        borderColor: selectedvalue === item.id ? _Colors.default.digitYellow : '#DDDDDD',
        marginTop: calculateMarginTop(index),
        borderWidth: selectedvalue === item.id ? 2 : 1
      }]
    }, item.icon ? /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
      source: item.icon,
      style: styles.icon
    }) : null, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
      style: [{
        flexDirection: 'row',
        alignItems: 'center'
      }, rightArrow ? {
        paddingHorizontal: 10
      } : null]
    }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
      style: [styles.text, {
        color: item.icon ? _Colors.default.borderBlack : _Colors.default.darkBlack,
        fontSize: item.icon ? 12 : 14
      }, labelStyle]
    }, isDisplayName ? item.displayName : item.name), rightArrow ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
      style: styles.imageView
    }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
      source: arrowRight,
      style: styles.imageStyle
    })) : null)));
  }), isSelector ? /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
    key: "Selector",
    onPress: onSelectorPress,
    disabled: disabled,
    style: {
      marginRight: 0,
      flex: 1,
      minWidth: calculateWidth()
    }
  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
    style: [styles.button, styles.labelTop, {
      borderWidth: 1
    }, rightArrow ? {
      paddingHorizontal: 10
    } : null]
  }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
    style: [styles.selectorLabelText, labelStyle]
  }, selectorLabel), rightArrow ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
    style: styles.imageView
  }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
    source: arrowRight,
    style: styles.imageStyle
  })) : null)) : null);
};

var _default = SquareRadio;
exports.default = _default;

const styles = _reactNative.StyleSheet.create({
  container: {
    width: '100%',
    flexDirection: 'row',
    justifyContent: 'space-between',
    flexWrap: 'wrap',
    alignContent: 'flex-start'
  },
  icon: {
    width: 20,
    height: 20,
    marginBottom: 6
  },
  button: {
    paddingVertical: 11,
    alignItems: 'center',
    borderRadius: 4,
    shadowColor: "red",
    shadowOffset: {
      width: 20,
      height: 20
    },
    shadowOpacity: 1,
    shadowRadius: 4.65 // elevation: 1,

  },
  text: {
    fontFamily: 'Muli-Regular'
  },
  imageStyle: {
    marginRight: 5,
    width: 4,
    height: 8
  },
  imageView: {
    flex: 1,
    justifyContent: 'flex-end',
    alignItems: 'flex-end'
  },
  selectorLabelText: {
    fontFamily: 'Muli-Regular',
    color: _Colors.default.darkBlack,
    fontSize: 14
  },
  labelTop: {
    borderColor: '#707070',
    marginTop: 16,
    flexDirection: 'row',
    alignItems: 'center'
  }
});
//# sourceMappingURL=SquareRadio.js.map