@atlaskit/button/dist/cjs/old-button/button.js

A button triggers an event or action. They let users know what will happen next.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireWildcard(require("react"));
var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
var _buttonBase = _interopRequireDefault(require("./shared/button-base"));
var _css = require("./shared/css");
var _getIsOnlySingleIcon = _interopRequireDefault(require("./shared/get-is-only-single-icon"));
var _excluded = ["appearance", "children", "iconBefore", "iconAfter", "isSelected", "onMouseDown", "onMouseUp", "shouldFitContainer", "spacing"]; // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
var isFirefox = typeof navigator !== 'undefined' && navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
/**
 * __Button__
 *
 * @deprecated Legacy buttons are deprecated and will be removed from `atlaskit/button` in an upcoming major release. Please use the new Button components from `@atlaskit/button/new`
 *
 * Please refer to the [migration guide](https://atlassian.design/components/button/button-legacy/migration-guide) for further details.
 *
 * A button triggers an event or action. They let users know what will happen next.
 *
 * - [Examples](https://atlassian.design/components/button/button-legacy/examples)
 * - [Code](https://atlassian.design/components/button/button-legacy/code)
 * - [Usage](https://atlassian.design/components/button/button-legacy/usage)
 */
var Button = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef(function Button(_ref, ref) {
  var _ref$appearance = _ref.appearance,
    appearance = _ref$appearance === void 0 ? 'default' : _ref$appearance,
    children = _ref.children,
    iconBefore = _ref.iconBefore,
    iconAfter = _ref.iconAfter,
    _ref$isSelected = _ref.isSelected,
    isSelected = _ref$isSelected === void 0 ? false : _ref$isSelected,
    _ref$onMouseDown = _ref.onMouseDown,
    providedOnMouseDown = _ref$onMouseDown === void 0 ? _noop.default : _ref$onMouseDown,
    _ref$onMouseUp = _ref.onMouseUp,
    providedOnMouseUp = _ref$onMouseUp === void 0 ? _noop.default : _ref$onMouseUp,
    _ref$shouldFitContain = _ref.shouldFitContainer,
    shouldFitContainer = _ref$shouldFitContain === void 0 ? false : _ref$shouldFitContain,
    _ref$spacing = _ref.spacing,
    spacing = _ref$spacing === void 0 ? 'default' : _ref$spacing,
    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
  var isOnlySingleIcon = (0, _getIsOnlySingleIcon.default)({
    children: children,
    iconBefore: iconBefore,
    iconAfter: iconAfter
  });
  var _useState = (0, _react.useState)(false),
    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
    isActive = _useState2[0],
    setIsActive = _useState2[1];

  // Wrap onMouseDown / onMouseUp to manually trigger active state
  //  in Firefox
  var onMouseDown = (0, _react.useCallback)(function (event) {
    providedOnMouseDown(event);
    if (isFirefox) {
      setIsActive(true);
    }
  }, [providedOnMouseDown, setIsActive]);
  var onMouseUp = (0, _react.useCallback)(function (event) {
    providedOnMouseUp(event);
    if (isFirefox) {
      setIsActive(false);
    }
  }, [providedOnMouseUp, setIsActive]);
  var buttonCss = (0, _react.useMemo)(function () {
    return (0, _css.getCss)({
      appearance: appearance,
      spacing: spacing,
      isSelected: isSelected,
      shouldFitContainer: shouldFitContainer,
      isOnlySingleIcon: isOnlySingleIcon
    });
  }, [appearance, spacing, isSelected, shouldFitContainer, isOnlySingleIcon]);
  return /*#__PURE__*/_react.default.createElement(_buttonBase.default, (0, _extends2.default)({}, rest, {
    ref: ref,
    appearance: appearance,
    buttonCss: buttonCss,
    children: children
    // Due to how click events are set, we need to set active styles
    //  manually in Firefox and wrap onMouseDown/onMouseUp
    ,
    "data-firefox-is-active": isActive ? true : undefined,
    iconAfter: iconAfter,
    iconBefore: iconBefore,
    isSelected: isSelected,
    onMouseDown: onMouseDown,
    onMouseUp: onMouseUp,
    spacing: spacing
  }));
}));

// Tools including enzyme rely on components having a display name
Button.displayName = 'Button';
var _default = exports.default = Button;