var __defProp = Object.defineProperty;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
  for (var prop in b || (b = {}))
    if (__hasOwnProp.call(b, prop))
      __defNormalProp(a, prop, b[prop]);
  if (__getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(b)) {
      if (__propIsEnum.call(b, prop))
        __defNormalProp(a, prop, b[prop]);
    }
  return a;
};
import React, { useEffect, useContext, useRef, useState, useMemo, createContext, forwardRef, useImperativeHandle } from "react";
import classnames from "classnames";
import ConfigProviderContext from "../config-provider/ConfigProviderContext";
import { HAPTICS_FEEDBACK } from "../utils/constant";
import { isDef } from "../utils";
import useScrollParent from "../hooks/use-scroll-parent";
import useClickAway from "../hooks/use-click-away";
import useEventListener from "../hooks/use-event-listener";
import useRefs from "../hooks/use-refs";
import getRect from "../hooks/get-rect";
const DropdownMenuContext = /* @__PURE__ */ createContext({});
const DropdownMenu = /* @__PURE__ */ forwardRef((props, ref) => {
  const {
    prefixCls,
    createNamespace
  } = useContext(ConfigProviderContext);
  const [bem] = createNamespace("dropdown-menu", prefixCls);
  const [titleFlag, setTitleFlag] = useState(props.shouldRenderTitle);
  const [showPopupIndex, setShowPopupIndex] = useState(null);
  const showPopupIndexRef = useRef(null);
  const rect = useRef({
    bottom: 0,
    top: 0
  });
  const root = useRef();
  const barRef = useRef();
  const offsetRef = useRef(0);
  const [childrenRefs, setChildrenRefs] = useRefs();
  const scrollParent = useScrollParent(root);
  const opened = useMemo(() => {
    return showPopupIndex !== null;
  }, [showPopupIndex]);
  const barStyle = () => {
    if (opened && isDef(props.zIndex)) {
      return {
        zIndex: +props.zIndex + 1
      };
    }
    return {};
  };
  const updateShowPopupIndex = (current) => {
    showPopupIndexRef.current = current;
    setShowPopupIndex(current);
  };
  const updateOffset = () => {
    if (barRef.current) {
      rect.current = getRect(barRef.current);
      if (props.direction === "down") {
        offsetRef.current = rect.current.bottom;
      } else {
        offsetRef.current = window.innerHeight - rect.current.top;
      }
    }
  };
  const closeAll = () => {
    childrenRefs.forEach((item) => {
      item.toggle(false);
    });
    updateShowPopupIndex(null);
  };
  useImperativeHandle(ref, () => ({
    close: closeAll
  }));
  const onClickAway = () => {
    if (props.closeOnClickOutside) {
      closeAll();
    }
  };
  useEffect(() => {
    if (barRef.current) {
      updateOffset();
    }
  }, [barRef.current]);
  const onScroll = () => {
    if (opened) {
      updateOffset();
    }
  };
  const showItem = (index) => {
    const item = childrenRefs[index];
    updateOffset();
    updateShowPopupIndex(index);
    item.toggle(true);
  };
  const onToggleItem = (active) => {
    childrenRefs.forEach((child, index) => {
      if (index === active) {
        if (active === showPopupIndexRef.current) {
          updateShowPopupIndex(null);
          child.toggle();
          return;
        }
        showItem(active);
      } else {
        child.toggle(false, {
          immediate: false
        });
      }
    });
  };
  const renderTitle = (item, index) => {
    const showPopup = showPopupIndex === index;
    const {
      disabled,
      titleClass
    } = item;
    return /* @__PURE__ */ React.createElement("div", {
      key: index,
      role: "button",
      tabIndex: disabled ? -1 : 0,
      className: classnames(bem("item", {
        disabled
      }), {
        [HAPTICS_FEEDBACK]: !disabled
      }),
      onClick: () => {
        if (!disabled) {
          onToggleItem(index);
        }
      }
    }, /* @__PURE__ */ React.createElement("span", {
      className: classnames(bem("title", {
        down: showPopup === (props.direction === "down"),
        active: showPopup
      }), titleClass),
      style: {
        color: showPopup ? props.activeColor : ""
      }
    }, /* @__PURE__ */ React.createElement("div", {
      className: "rc-ellipsis"
    }, item.renderTitle())));
  };
  useClickAway(root, onClickAway);
  useEventListener("scroll", onScroll, {
    target: scrollParent
  });
  const handleChange = (value) => {
    var _a;
    if (titleFlag) {
      setTitleFlag(false);
    } else {
      setTitleFlag(true);
    }
    updateShowPopupIndex(null);
    (_a = props.onChange) == null ? void 0 : _a.call(props, value);
  };
  return /* @__PURE__ */ React.createElement(DropdownMenuContext.Provider, {
    value: {
      props,
      offset: offsetRef.current,
      onChange: handleChange,
      close: closeAll
    }
  }, /* @__PURE__ */ React.createElement("div", {
    ref: root,
    className: classnames(bem(), props.className),
    style: __spreadValues({}, props.style)
  }, /* @__PURE__ */ React.createElement("div", {
    ref: barRef,
    style: barStyle(),
    className: classnames(bem("bar", {
      opened
    }))
  }, childrenRefs.map(renderTitle)), React.Children.toArray(props.children).filter(Boolean).map((child, index) => /* @__PURE__ */ React.cloneElement(child, {
    ref: setChildrenRefs(index)
  }))));
});
DropdownMenu.defaultProps = {
  duration: 200,
  overlay: true,
  direction: "down",
  zIndex: 2e3,
  closeOnClickOutside: true,
  closeOnClickOverlay: true,
  shouldRenderTitle: false
};
DropdownMenu.displayName = "DropdownMenu";
var stdin_default = DropdownMenu;
export {
  DropdownMenuContext,
  stdin_default as default
};
