function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

import React, { useContext } from 'react';
import { Cross } from '@react-vant/icons';
import clsx from 'clsx';
import { pick } from '../utils';
import Loading from '../loading';
import Popup from '../popup';
import { sharedPopupProps } from '../popup/Popup';
import ConfigProviderContext from '../config-provider/ConfigProviderContext';

var ActionSheet = function ActionSheet(props) {
  var _useContext = useContext(ConfigProviderContext),
      prefixCls = _useContext.prefixCls,
      createNamespace = _useContext.createNamespace;

  var _createNamespace = createNamespace('action-sheet', prefixCls),
      bem = _createNamespace[0];

  var onCancel = function onCancel() {
    props.onClose == null ? void 0 : props.onClose();
    props.onCancel == null ? void 0 : props.onCancel();
  };

  var renderHeader = function renderHeader() {
    if (!props.title) return null;
    return /*#__PURE__*/React.createElement("div", {
      className: clsx(bem('header'))
    }, props.title, props.closeable && /*#__PURE__*/React.cloneElement(props.closeIcon, {
      className: clsx(bem('clear')),
      onClick: onCancel
    }));
  };

  var renderCancel = function renderCancel() {
    if (!props.cancelText) return null;
    return [/*#__PURE__*/React.createElement("div", {
      key: "cancel-gap",
      className: clsx(bem('gap'))
    }), /*#__PURE__*/React.createElement("button", {
      key: "cancel-btn",
      type: "button",
      className: clsx(bem('cancel')),
      onClick: onCancel
    }, props.cancelText)];
  };

  var renderOption = function renderOption(item, index) {
    var name = item.name,
        color = item.color,
        subname = item.subname,
        loading = item.loading,
        callback = item.callback,
        disabled = item.disabled,
        className = item.className,
        style = item.style;
    var Content = loading ? /*#__PURE__*/React.createElement(Loading, {
      className: clsx(bem('loading-icon'))
    }) : [/*#__PURE__*/React.createElement("span", {
      key: index + "-1",
      className: clsx(bem('name'))
    }, name), subname && /*#__PURE__*/React.createElement("div", {
      key: index + "-2",
      className: clsx(bem('subname'))
    }, subname)];

    var onClick = function onClick() {
      if (disabled || loading) {
        return;
      }

      if (callback) {
        callback(item);
      }

      if (props.closeOnClickAction) {
        onCancel();
      }

      setTimeout(function () {
        props.onSelect == null ? void 0 : props.onSelect(item, index);
      }, 0);
    };

    return /*#__PURE__*/React.createElement("button", {
      key: index,
      type: "button",
      style: _extends({
        color: color
      }, style),
      className: clsx(bem('item', {
        loading: loading,
        disabled: disabled
      }), className),
      onClick: onClick
    }, Content);
  };

  var renderDescription = function renderDescription() {
    if (props.description) {
      return /*#__PURE__*/React.createElement("div", {
        className: clsx(bem('description'))
      }, props.description);
    }

    return null;
  };

  var renderOptions = function renderOptions() {
    if (props.actions) {
      return props.actions.map(renderOption);
    }

    return null;
  };

  return /*#__PURE__*/React.createElement(Popup, _extends({
    visible: props.visible,
    className: clsx(bem()),
    position: "bottom"
  }, pick(props, sharedPopupProps), {
    onClose: onCancel,
    closeable: false
  }), renderHeader(), renderDescription(), /*#__PURE__*/React.createElement("div", {
    className: clsx(bem('content'))
  }, renderOptions(), props.children), renderCancel());
};

ActionSheet.defaultProps = {
  closeable: true,
  safeAreaInsetBottom: true,
  round: true,
  lockScroll: true,
  overlay: true,
  closeOnClickOverlay: true,
  closeIcon: /*#__PURE__*/React.createElement(Cross, null)
};
export default ActionSheet;