@atlaskit/modal-dialog/dist/esm/close-button.js

A modal dialog displays content that requires user interaction, in a layer above the page.

import React from 'react';
import { IconButton } from '@atlaskit/button/new';
import CrossIcon from '@atlaskit/icon/core/cross';
/**
 * __Close button__
 *
 * The close button is to be used for customized modal headers to ensure that
 * all users have an accessible and obvious way to close the modal dialog.
 *
 * When using this in a custom header, ensure that the close button renders
 * first in the DOM to make sure that users will encounter all elements of the
 * modal dialog, including everything within the modal header. This can be done
 * using a `Flex` primitive as the custom header's container with a flex
 * direction of `row-reverse`.
 */
export var CloseButton = function CloseButton(_ref) {
  var label = _ref.label,
    onBlur = _ref.onBlur,
    onClick = _ref.onClick,
    testId = _ref.testId;
  return /*#__PURE__*/React.createElement(IconButton, {
    testId: testId && "".concat(testId, "--close-button"),
    appearance: "subtle",
    icon: CrossIcon,
    label: label || 'Close Modal',
    onBlur: onBlur,
    onClick: onClick
  });
};