"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

function _react() {
  const data = _interopRequireWildcard(require("react"));

  _react = function () {
    return data;
  };

  return data;
}

function _jsxRuntime() {
  const data = require("react/jsx-runtime");

  _jsxRuntime = function () {
    return data;
  };

  return data;
}

function _icons() {
  const data = require("@react-vant/icons");

  _icons = function () {
    return data;
  };

  return data;
}

function _clsx() {
  const data = _interopRequireDefault(require("clsx"));

  _clsx = function () {
    return data;
  };

  return data;
}

var _cell = _interopRequireDefault(require("../cell"));

var _ConfigProviderContext = _interopRequireDefault(require("../config-provider/ConfigProviderContext"));

var _hooks = require("../hooks");

var _useSsrCompat = _interopRequireDefault(require("../hooks/use-ssr-compat"));

var _popup = _interopRequireDefault(require("../popup"));

var _utils = require("../utils");

var _renderToContainer = require("../utils/dom/renderToContainer");

var _DropdownMenuContext = _interopRequireDefault(require("./DropdownMenuContext"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

const inheritPropsKey = ['overlay', 'overlayClass', 'overlayStyle', 'disabled', 'placeholder', 'onOpen', 'onClosed', 'onOpened', 'teleport', 'closeOnClickOverlay'];

function inheritProps(parentProps, props) {
  return Object.assign(Object.assign({}, parentProps), props);
}

const DropdownMenuItem = (0, _react().forwardRef)((props, ref) => {
  var _a;

  const [state, setState] = (0, _hooks.useSetState)({
    transition: true,
    showWrapper: false
  });
  const [ssrCompatRender] = (0, _useSsrCompat.default)();
  const {
    prefixCls,
    createNamespace
  } = (0, _react().useContext)(_ConfigProviderContext.default);
  const [bem] = createNamespace('dropdown-item', prefixCls);
  const parent = (0, _react().useContext)(_DropdownMenuContext.default);
  const currentValue = (_a = parent.value) === null || _a === void 0 ? void 0 : _a[props.name];

  const onClosed = () => {
    var _a, _b;

    setState({
      showWrapper: false
    });
    (_b = (_a = props.onClosed) !== null && _a !== void 0 ? _a : parent.props.onClosed) === null || _b === void 0 ? void 0 : _b();
  };

  const onClickWrapper = event => {
    // prevent being identified as clicking outside and closed when using teleport
    if (props.teleport) {
      event.stopPropagation();
    }
  };

  const onClose = () => {
    var _a, _b;

    parent.close();
    (_b = (_a = props.onClose) !== null && _a !== void 0 ? _a : parent.props.onClose) === null || _b === void 0 ? void 0 : _b();
  };

  const toggle = (show = !props.showPopup, options = {}) => {
    if (show === props.showPopup) {
      return;
    }

    const newState = {};
    newState.transition = !options.immediate;

    if (show) {
      newState.showWrapper = true;
    } else {
      onClose();
    }

    setState(newState);
  };

  const renderTitle = itemValue => {
    if (props.title) {
      return props.title;
    }

    const match = props.options.find(option => option.value === itemValue);
    return match ? match.text : props.placeholder;
  };

  const renderOption = option => {
    const {
      activeColor
    } = parent.props;
    const active = option.value === currentValue;

    const onClick = () => {
      if (option.value !== currentValue) {
        parent.onChange({
          [props.name]: option.value
        });
      }

      onClose();
    };

    return (0, _jsxRuntime().jsx)(_cell.default, Object.assign({
      clickable: true,
      icon: option.icon,
      title: option.text,
      className: (0, _clsx().default)(bem('option', {
        active
      })),
      style: {
        color: active ? activeColor : ''
      },
      onClick: onClick
    }, {
      children: active && (0, _jsxRuntime().jsx)(_icons().Success, {
        className: (0, _clsx().default)(bem('icon')),
        color: activeColor
      })
    }), option.value);
  };

  const renderContent = () => {
    var _a;

    const {
      offset
    } = props;
    const {
      zIndex,
      overlayStyle,
      duration,
      direction
    } = parent.props;
    const style = (0, _utils.getZIndexStyle)(zIndex);

    if (direction === 'down') {
      style.top = `${offset}px`;
    } else {
      style.bottom = `${offset}px`;
    }

    const attrs = (0, _utils.pick)(inheritProps(parent.props, props), inheritPropsKey);
    return (0, _jsxRuntime().jsx)("div", Object.assign({
      style: Object.assign(Object.assign({}, style), {
        display: state.showWrapper ? 'block' : 'none'
      }),
      className: (0, _clsx().default)(bem([direction])),
      onClick: onClickWrapper
    }, {
      children: (0, _jsxRuntime().jsxs)(_popup.default, Object.assign({}, attrs, {
        teleport: null,
        visible: props.showPopup,
        className: (0, _clsx().default)(bem('content')),
        position: direction === 'down' ? 'top' : 'bottom',
        duration: state.transition ? +duration : 0,
        overlayStyle: Object.assign({
          position: 'absolute'
        }, overlayStyle),
        onClose: onClose,
        onClosed: onClosed
      }, {
        children: [(_a = props.options) === null || _a === void 0 ? void 0 : _a.map(renderOption), props.children]
      }))
    }));
  };

  (0, _react().useImperativeHandle)(ref, () => ({
    toggle,
    renderTitle,
    state,
    titleClass: props.titleClass,
    disabled: props.disabled,
    name: props.name,
    options: props.options
  }));
  if (props.teleport) return ssrCompatRender(() => (0, _renderToContainer.renderToContainer)(props.teleport, renderContent()));
  return renderContent();
});
DropdownMenuItem.defaultProps = {
  placeholder: '请选择',
  options: []
};
var _default = DropdownMenuItem;
exports.default = _default;