"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _clsx = _interopRequireDefault(require("clsx"));
var _element = require("@wordpress/element");
var _components = require("@wordpress/components");
var _icons = require("@wordpress/icons");
var _i18n = require("@wordpress/i18n");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

function ZoomOutModeInserterButton({
  isVisible,
  onClick
}) {
  const [zoomOutModeInserterButtonHovered, setZoomOutModeInserterButtonHovered] = (0, _element.useState)(false);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
    variant: "primary",
    icon: _icons.plus,
    size: "compact",
    className: (0, _clsx.default)('block-editor-button-pattern-inserter__button', 'block-editor-block-tools__zoom-out-mode-inserter-button', {
      'is-visible': isVisible || zoomOutModeInserterButtonHovered
    }),
    onClick: onClick,
    onMouseOver: () => {
      setZoomOutModeInserterButtonHovered(true);
    },
    onMouseOut: () => {
      setZoomOutModeInserterButtonHovered(false);
    },
    label: (0, _i18n._x)('Add pattern', 'Generic label for pattern inserter button')
  });
}
var _default = exports.default = ZoomOutModeInserterButton;
//# sourceMappingURL=zoom-out-mode-inserter-button.js.map