import { jsxs as r, jsx as e } from "react/jsx-runtime";
import { useState as s } from "react";
import { usePopper as g } from "react-popper";
import v from "../../utils/classNames.js";
import w from "../menuItems/MenuItems.js";
import x from "../menuItems/MenuItemList.js";
const E = (n) => {
  const { title: a = "", items: l = [], disabled: t = !1, className: m, ...i } = n, p = v("dropdown-submenu", t && "disabled", m), [u, c] = s(null), [f, d] = s(null), [h, o] = s(!1), b = () => o(!0), M = () => o(!1), { styles: N, attributes: P } = g(u, f, {
    placement: "right-start",
    modifiers: [
      {
        name: "offset",
        options: {
          offset: [-4, 0]
        }
      }
    ]
  });
  return /* @__PURE__ */ r(
    "li",
    {
      ref: c,
      ...i,
      className: p,
      onMouseEnter: b,
      onMouseLeave: M,
      children: [
        /* @__PURE__ */ r("a", { className: "submenu-title", role: "menuitem", children: [
          /* @__PURE__ */ e("span", { className: "submenu-title-text", children: a }),
          /* @__PURE__ */ e("span", { className: "rioglyph rioglyph-chevron-right" })
        ] }),
        h && !t && /* @__PURE__ */ e(x, { ref: d, style: N.popper, ...P.popper, children: /* @__PURE__ */ e(w, { items: l }) })
      ]
    }
  );
};
export {
  E as default
};
//# sourceMappingURL=DropdownSubmenu.js.map
