'use strict';

var _extends = require('@babel/runtime/helpers/extends');
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
require('core-js/modules/es.symbol.js');
require('core-js/modules/es.symbol.description.js');
var React = require('react');
var PropTypes = require('prop-types');
var classnames = require('classnames');
var Button = require('../../Button/Button.js');
var Settings = require('../../../constants/Settings.js');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var _extends__default = /*#__PURE__*/_interopDefault(_extends);
var _defineProperty__default = /*#__PURE__*/_interopDefault(_defineProperty);
var _slicedToArray__default = /*#__PURE__*/_interopDefault(_slicedToArray);
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefault(_objectWithoutProperties);
var React__default = /*#__PURE__*/_interopDefault(React);
var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
var classnames__default = /*#__PURE__*/_interopDefault(classnames);

var _excluded = ["onClick", "testId", "className", "description", "isActive", "tooltipAlignment", "tooltipPosition", "langDir"];
var iotPrefix = Settings.settings.iotPrefix,
  prefix = Settings.settings.prefix;
var propTypes = {
  onClick: PropTypes__default.default.func.isRequired,
  testId: PropTypes__default.default.string.isRequired,
  renderIcon: PropTypes__default.default.object.isRequired,
  // eslint-disable-line react/forbid-prop-types
  description: PropTypes__default.default.node.isRequired,
  /** is the button currently 'toggled' active, used for column filters */
  isActive: PropTypes__default.default.bool,
  /** is the button disabled */
  disabled: PropTypes__default.default.bool,
  tooltipAlignment: PropTypes__default.default.oneOf(['start', 'center', 'end']),
  tooltipPosition: PropTypes__default.default.oneOf(['top', 'right', 'bottom', 'left']),
  langDir: PropTypes__default.default.oneOf(['ltr', 'rtl'])
};
var defaultProps = {
  isActive: false,
  disabled: false,
  tooltipAlignment: 'center',
  tooltipPosition: 'bottom',
  langDir: 'ltr'
};

/**
 * Toolbar button that renders an icon only button
 */
var TableToolbarSVGButton = function TableToolbarSVGButton(_ref) {
  var onClick = _ref.onClick,
    testId = _ref.testId,
    className = _ref.className,
    description = _ref.description,
    isActive = _ref.isActive,
    tooltipAlignment = _ref.tooltipAlignment,
    tooltipPosition = _ref.tooltipPosition,
    langDir = _ref.langDir,
    rest = _objectWithoutProperties__default.default(_ref, _excluded);
  var _useState = React.useState(tooltipAlignment),
    _useState2 = _slicedToArray__default.default(_useState, 2),
    adjustedTooltipAlignment = _useState2[0],
    setAdjustedTooltipAlignment = _useState2[1];
  return /*#__PURE__*/React__default.default.createElement(Button, _extends__default.default({}, rest, {
    ref: function ref(node) {
      /* istanbul ignore else */
      if (node) {
        var tooltip = node.querySelector(".".concat(prefix, "--assistive-text"));
        if (!tooltip) {
          return;
        }
        var childRect = tooltip.getBoundingClientRect();
        var parentRect = node.parentElement.getBoundingClientRect();
        /* istanbul ignore else */
        if (langDir === 'ltr' && childRect.left + childRect.width > parentRect.left + parentRect.width) {
          setAdjustedTooltipAlignment('end');
          return;
        }
        /* istanbul ignore else */
        if (langDir === 'rtl' && childRect.left < parentRect.left) {
          setAdjustedTooltipAlignment('start');
        }
      }
    },
    className: classnames__default.default("".concat(prefix, "--btn--icon-only"), "".concat(iotPrefix, "--tooltip-svg-wrapper"), className, _defineProperty__default.default({}, "".concat(iotPrefix, "--table-toolbar-button-active"), isActive)),
    kind: "icon-selection",
    onClick: onClick,
    iconDescription: description,
    testId: testId,
    tooltipAlignment: adjustedTooltipAlignment,
    tooltipPosition: tooltipPosition
  }));
};
TableToolbarSVGButton.propTypes = propTypes;
TableToolbarSVGButton.defaultProps = defaultProps;
TableToolbarSVGButton.__docgenInfo = {
  "description": "Toolbar button that renders an icon only button",
  "methods": [],
  "displayName": "TableToolbarSVGButton",
  "props": {
    "isActive": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "is the button currently 'toggled' active, used for column filters",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "disabled": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "is the button disabled",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "tooltipAlignment": {
      "defaultValue": {
        "value": "'center'",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "enum",
        "value": [{
          "value": "'start'",
          "computed": false
        }, {
          "value": "'center'",
          "computed": false
        }, {
          "value": "'end'",
          "computed": false
        }]
      },
      "required": false
    },
    "tooltipPosition": {
      "defaultValue": {
        "value": "'bottom'",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "enum",
        "value": [{
          "value": "'top'",
          "computed": false
        }, {
          "value": "'right'",
          "computed": false
        }, {
          "value": "'bottom'",
          "computed": false
        }, {
          "value": "'left'",
          "computed": false
        }]
      },
      "required": false
    },
    "langDir": {
      "defaultValue": {
        "value": "'ltr'",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "enum",
        "value": [{
          "value": "'ltr'",
          "computed": false
        }, {
          "value": "'rtl'",
          "computed": false
        }]
      },
      "required": false
    },
    "onClick": {
      "description": "",
      "type": {
        "name": "func"
      },
      "required": true
    },
    "testId": {
      "description": "",
      "type": {
        "name": "string"
      },
      "required": true
    },
    "renderIcon": {
      "description": "",
      "type": {
        "name": "object"
      },
      "required": true
    },
    "description": {
      "description": "",
      "type": {
        "name": "node"
      },
      "required": true
    }
  }
};
var TableToolbarSVGButton$1 = TableToolbarSVGButton;

module.exports = TableToolbarSVGButton$1;
