import { rpx2vw4style as __rpx2vw__ } from "babel-runtime-jsx-style-transform";

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); }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }

function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }

function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }

function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }

function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }

function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }

import { __rest } from "tslib";
import classNames from 'classnames';
import React, { createElement, forwardRef, Fragment, useCallback, useContext, useImperativeHandle, useState } from "react";
import { Text } from "@alifd/meet-react-component-one";
import Button from '../button';
import Drawer from '../drawer';
import { ItemContext } from '../form';
import Icon from '../icon';
import SafeArea from '../safe-area';
import { useLocale } from '../locale';
import defaultLang from '../locale/lang/zh-cn';
import { isString, stopPropagation } from '../utils';
import { getValidChildren } from '../utils/children';
import BottomButton from '../bottom-button';
import View from '../view';

var SelectDrawer = function SelectDrawer(props, ref) {
  var _classNames3, _classNames4;

  var _props$prefix = props.prefix,
      prefix = _props$prefix === void 0 ? 'mt-' : _props$prefix,
      alignProp = props.align,
      children = props.children,
      _props$drawerTitle = props.drawerTitle,
      drawerTitle = _props$drawerTitle === void 0 ? '' : _props$drawerTitle,
      _props$iconType = props.iconType,
      iconType = _props$iconType === void 0 ? 'arrow-right' : _props$iconType,
      _props$content = props.content,
      content = _props$content === void 0 ? '' : _props$content,
      placeholder = props.placeholder,
      _props$type = props.type,
      type = _props$type === void 0 ? 'normal' : _props$type,
      _props$buttonPosition = props.buttonPosition,
      buttonPosition = _props$buttonPosition === void 0 ? 'top' : _props$buttonPosition,
      className = props.className,
      drawerClassName = props.drawerClassName,
      _props$disabled = props.disabled,
      disabled = _props$disabled === void 0 ? false : _props$disabled,
      _props$readOnly = props.readOnly,
      readOnly = _props$readOnly === void 0 ? false : _props$readOnly,
      _props$showIcon = props.showIcon,
      showIcon = _props$showIcon === void 0 ? true : _props$showIcon,
      _props$hasClear = props.hasClear,
      hasClear = _props$hasClear === void 0 ? false : _props$hasClear,
      _props$showToolbar = props.showToolbar,
      showToolbarProp = _props$showToolbar === void 0 ? true : _props$showToolbar,
      notFoundContent = props.notFoundContent,
      onOk = props.onOk,
      onCancel = props.onCancel,
      onClear = props.onClear,
      onVisibleChange = props.onVisibleChange,
      okText = props.okText,
      cancelText = props.cancelText,
      zIndex = props.zIndex,
      sizeProp = props.size,
      disableScroll = props.disableScroll,
      others = __rest(props, ["prefix", "align", "children", "drawerTitle", "iconType", "content", "placeholder", "type", "buttonPosition", "className", "drawerClassName", "disabled", "readOnly", "showIcon", "hasClear", "showToolbar", "notFoundContent", "onOk", "onCancel", "onClear", "onVisibleChange", "okText", "cancelText", "zIndex", "size", "disableScroll"]);

  var _useState = useState(false),
      _useState2 = _slicedToArray(_useState, 2),
      visible = _useState2[0],
      setVisible = _useState2[1];

  var _useContext = useContext(ItemContext),
      contextAlign = _useContext.contentAlign,
      contextSize = _useContext.size,
      isInsideForm = _useContext.isInsideForm;

  var _children = getValidChildren(children);

  var align = alignProp || (isInsideForm ? contextAlign : null) || 'left';
  var size = sizeProp || (isInsideForm ? contextSize : null) || 'medium';
  var shouldShowClear = !disabled && hasClear && content;
  var shouldShowIcon = showIcon && !shouldShowClear;
  var isInverse = type === 'inverse';
  var locale = useLocale('SelectDrawer', others, defaultLang.SelectDrawer);
  var showToolbar = showToolbarProp && (buttonPosition === 'top' || buttonPosition === 'bottom' && drawerTitle);
  var showBottomBtn = showToolbarProp && buttonPosition === 'bottom';
  var clsPrefix = "".concat(prefix, "selectdrawer");
  var doHide = useCallback(function () {
    if (visible) {
      setVisible(false);
    }

    if (onVisibleChange) {
      onVisibleChange(false);
    }
  }, [visible, setVisible, onVisibleChange]);
  var handleOk = useCallback(function () {
    var shouldHide = true;

    if (onOk) {
      shouldHide = onOk();
    }

    if (shouldHide !== false) {
      doHide();
    }
  }, [onOk, doHide]);
  var handleCancel = useCallback(function (reason) {
    var shouldHide = true;

    if (onCancel) {
      shouldHide = onCancel(reason);
    }

    if (shouldHide !== false) {
      doHide();
    }
  }, [onCancel, doHide]);
  var handleClear = useCallback(function (e) {
    e.preventDefault();
    stopPropagation(e);

    if (onClear) {
      onClear();
    }
  }, [onClear]);

  var handleOpen = function handleOpen() {
    if (disabled || readOnly || visible) {
      return;
    }

    if (_children || notFoundContent) {
      setVisible(true);

      if (onVisibleChange) {
        onVisibleChange(true);
      }
    }
  };

  useImperativeHandle(ref, function () {
    return Object.assign(ref.current || {}, {
      hide: doHide,
      show: handleOpen
    });
  });

  var getContent = function getContent() {
    if (!content) {
      var _classNames;

      return /*#__PURE__*/React.createElement(View, {
        className: classNames("".concat(clsPrefix, "-placeholder"), "".concat(clsPrefix, "-placeholder--").concat(align), (_classNames = {}, _defineProperty(_classNames, "".concat(clsPrefix, "-placeholder--disabled"), disabled), _defineProperty(_classNames, "".concat(clsPrefix, "-placeholder--inverse"), isInverse), _defineProperty(_classNames, "".concat(clsPrefix, "-placeholder--inverse-disabled"), disabled && isInverse), _classNames))
      }, placeholder || locale.placeHolderText);
    } else if (isString(content)) {
      var _classNames2;

      return /*#__PURE__*/React.createElement(Text, {
        numberOfLines: 1,
        className: classNames("".concat(clsPrefix, "-content-text"), "".concat(clsPrefix, "-content-text--").concat(align), (_classNames2 = {}, _defineProperty(_classNames2, "".concat(clsPrefix, "-content-text--disabled"), disabled), _defineProperty(_classNames2, "".concat(clsPrefix, "-content-text--inverse"), isInverse), _defineProperty(_classNames2, "".concat(clsPrefix, "-content-text--inverse-disabled"), isInverse && disabled), _classNames2)),
        style: __rpx2vw__({
          textAlign: align
        })
      }, content);
    } else {
      return content;
    }
  };

  var renderChildren = function renderChildren() {
    var ret = null;

    if (_children) {
      ret = /*#__PURE__*/React.createElement(View, {
        className: "".concat(clsPrefix, "-drawer-content")
      }, _children);
    } else if (isString(notFoundContent)) {
      ret = /*#__PURE__*/React.createElement(View, {
        className: "".concat(clsPrefix, "-drawer-content ").concat(clsPrefix, "-drawer--empty")
      }, /*#__PURE__*/React.createElement(Text, {
        className: "".concat(clsPrefix, "-drawer-empty-text")
      }, notFoundContent));
    } else if (notFoundContent) {
      ret = /*#__PURE__*/React.createElement(View, {
        className: "".concat(clsPrefix, "-drawer-content ").concat(clsPrefix, "-drawer--empty")
      }, /*#__PURE__*/React.createElement(View, {
        className: "".concat(clsPrefix, "-drawer-empty-text")
      }, notFoundContent));
    }

    return ret;
  };

  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(View, _extends({
    ref: ref
  }, others, {
    className: classNames(clsPrefix, "".concat(clsPrefix, "--").concat(size), className),
    onClick: handleOpen
  }), /*#__PURE__*/React.createElement(View, {
    className: classNames("".concat(clsPrefix, "-content"), "".concat(clsPrefix, "-content--").concat(size), "".concat(clsPrefix, "-content--").concat(align))
  }, getContent()), shouldShowIcon ? /*#__PURE__*/React.createElement(View, {
    className: classNames("".concat(clsPrefix, "-icon"), "".concat(clsPrefix, "-icon--").concat(size))
  }, /*#__PURE__*/React.createElement(Icon, {
    className: classNames("".concat(clsPrefix, "-icon-text"), "".concat(clsPrefix, "-icon-text--").concat(size), (_classNames3 = {}, _defineProperty(_classNames3, "".concat(clsPrefix, "-icon-text--inverse"), isInverse), _defineProperty(_classNames3, "".concat(clsPrefix, "-icon-text--disabled"), disabled), _defineProperty(_classNames3, "".concat(clsPrefix, "-icon-text--inverse-disabled"), isInverse && disabled), _classNames3)),
    name: iconType
  })) : null, shouldShowClear ? /*#__PURE__*/React.createElement(View, {
    className: classNames("".concat(clsPrefix, "-icon"), "".concat(clsPrefix, "-icon--").concat(size)),
    onClick: handleClear
  }, /*#__PURE__*/React.createElement(Icon, {
    className: classNames("".concat(clsPrefix, "-icon-text--").concat(size), (_classNames4 = {}, _defineProperty(_classNames4, "".concat(clsPrefix, "-icon-text--inverse"), isInverse), _defineProperty(_classNames4, "".concat(clsPrefix, "-icon-text--disabled"), disabled), _defineProperty(_classNames4, "".concat(clsPrefix, "-icon-text--inverse-disabled"), isInverse && disabled), _classNames4)),
    name: "delete-filling"
  })) : null), /*#__PURE__*/React.createElement(Drawer, {
    visible: visible,
    placement: "bottom",
    closeMode: ['mask'],
    onClose: handleCancel,
    zIndex: zIndex,
    className: classNames("".concat(clsPrefix, "-drawer"), drawerClassName),
    containerClassName: "".concat(clsPrefix, "-container"),
    disableScroll: disableScroll
  }, showToolbar ? /*#__PURE__*/React.createElement(View, {
    className: classNames("".concat(clsPrefix, "-toolbar"), _defineProperty({}, "".concat(clsPrefix, "-toolbar--no-border"), buttonPosition === 'bottom'))
  }, buttonPosition !== 'bottom' ? /*#__PURE__*/React.createElement(Button, {
    className: "".concat(clsPrefix, "-toolbar-btn-cancel"),
    model: "text",
    onClick: function onClick() {
      return handleCancel('cancel-button');
    }
  }, cancelText || locale.cancel) : null, /*#__PURE__*/React.createElement(View, {
    className: "".concat(clsPrefix, "-toolbar-title")
  }, drawerTitle), buttonPosition !== 'bottom' ? /*#__PURE__*/React.createElement(Button, {
    className: "".concat(clsPrefix, "-toolbar-btn-ok"),
    model: "text",
    type: "primary",
    onClick: handleOk
  }, okText || locale.ok) : null) : null, renderChildren(), showBottomBtn ? /*#__PURE__*/React.createElement(BottomButton, {
    enableSafeArea: true,
    okText: okText || locale.ok,
    cancelText: cancelText || locale.cancel,
    onOk: handleOk,
    onCancel: function onCancel() {
      return handleCancel('cancel-button');
    }
  }) : /*#__PURE__*/React.createElement(SafeArea, null)));
};

SelectDrawer.displayName = 'SelectDrawer';
export default /*#__PURE__*/forwardRef(SelectDrawer);