import { jsxs as d, jsx as t } from "react/jsx-runtime";
import { Typography as m } from "@mui/material";
import { translate as f } from "@arcblock/ux/lib/Locale/util";
import { useMemoizedFn as S } from "ahooks";
import { useLocaleContext as x } from "@arcblock/ux/lib/Locale/context";
import h from "./duration-menu.js";
import M, { StyledMenu as y } from "./menu-item.js";
import { translations as v } from "../../libs/locales.js";
function L({ data: e, open: s, onSelect: a, anchorEl: l = void 0, selected: n }) {
  const { locale: c } = x(), i = S((o, p = {}) => f(v, o, c, "en", p)), r = (o) => {
    a(o);
  }, u = () => e.map((o) => o.children ? /* @__PURE__ */ t(h, { data: o, selected: n, onSelect: r }, o.id) : /* @__PURE__ */ t(
    M,
    {
      icon: o.icon,
      selected: n?.value === o.id,
      onClick: () => r({ value: o.id }),
      children: o.name
    },
    o.id
  ));
  return /* @__PURE__ */ d(y, { open: s, onClose: () => r(), anchorEl: l, children: [
    /* @__PURE__ */ t(
      m,
      {
        component: "span",
        sx: {
          color: "text.secondary",
          pl: 2,
          fontSize: "14px"
        },
        children: i("profile.setStatus")
      }
    ),
    u()
  ] });
}
export {
  L as default
};
