import { _ as _extends } from '../extends-C4cduGrv.js';
import { _ as _objectWithoutProperties } from '../objectWithoutProperties-TXwlfNxG.js';
import React__default from 'react';
import PropTypes from 'prop-types';
import cx from 'classnames';
import { a as DialogOverlay, D as DialogContent } from '../dialog.esm-C1hoFD2p.js';
import { IconButton } from '../button/index.js';
import '../typeof-CgC7Bq6K.js';
import '../portal.esm-CuKGPwhL.js';
import '../utils.esm-CKyxlHOy.js';
import '../warning-s9zGJbnw.js';
import 'react-dom';
import '../setPrototypeOf-Bchah3-D.js';
import '../defineProperty-CEd-kZQW.js';
import '@reach/visually-hidden';
import '../ck-icon/index.js';
import '../ck-icon/assets/icon-map/index.js';
import '../icon/index.js';
import '@fortawesome/react-fontawesome';
import '../icon/icons.js';
import '../icon/library.js';
import '@fortawesome/fontawesome-svg-core';
import '@fortawesome/pro-solid-svg-icons';
import '@fortawesome/pro-light-svg-icons';
import '@fortawesome/free-brands-svg-icons';
import '../slicedToArray-BB-AwwkK.js';
import '../floating-ui.react-cWPyyUrN.js';
import '../toConsumableArray-dKQYsfpV.js';
import '../index-qSfOyGhk.js';
import '../button/button-group.js';

var _excluded = ["children", "label", "onClose", "className", "heading"];

function Drawer(_ref) {
  var children = _ref.children,
      label = _ref.label,
      onClose = _ref.onClose,
      className = _ref.className,
      heading = _ref.heading,
      props = _objectWithoutProperties(_ref, _excluded);

  var defaultDrawerClass = "\n    bg-white\n    flex\n    flex-col\n    fixed\n    font-sans\n    h-full\n    max-w-2xl\n    p-0\n    right-0\n    rounded\n    shadow\n    top-0\n    w-4/5\n  ";
  var headingClass = cx("flex", "justify-between", "items-center", "p-6", {
    "border-b": !!heading,
    "border-gray-200": !!heading
  });
  var drawerClass = cx(className, defaultDrawerClass);
  var headingTitleClass = "\n    text-gray-800\n    text-2xl\n    font-semibold\n  ";
  return /*#__PURE__*/React__default.createElement(DialogOverlay, _extends({
    onDismiss: onClose
  }, props), /*#__PURE__*/React__default.createElement(DialogContent, {
    key: "modal-content",
    "aria-label": label,
    className: drawerClass,
    style: {
      marginTop: 0,
      animation: "0.5s ease-in-out 0s 1 slide-in-from-right"
    }
  }, /*#__PURE__*/React__default.createElement("header", {
    className: headingClass
  }, typeof heading === "string" ? /*#__PURE__*/React__default.createElement("p", {
    className: headingTitleClass
  }, heading) : heading, /*#__PURE__*/React__default.createElement(IconButton, {
    icon: "close",
    is: "plain",
    label: "Close drawer",
    onClick: onClose
  })), /*#__PURE__*/React__default.createElement("div", {
    className: "p-6 overflow-y-auto h-full flex-1"
  }, children)));
}

Drawer.propTypes = {
  children: PropTypes.node,
  label: PropTypes.string,
  className: PropTypes.string,
  heading: PropTypes.string,
  onClose: PropTypes.func.isRequired
};

export { Drawer as default };
