import { memo, useMemo, createElement, Fragment } from "react";
import { Icon, FieldContainer, Dropdown } from "@contember/ui";
import { AddNewBlockButtonInner } from "./AddNewBlockButtonInner.js";
import { blockRepeaterDictionary } from "./Dictionary.js";
import { useMessageFormatter } from "../../../../i18n/useMessageFormatter.js";
const AddNewBlockButton = memo((props) => {
  const formatter = useMessageFormatter(blockRepeaterDictionary);
  const buttonProps = useMemo(() => ({
    children: /* @__PURE__ */ createElement(Fragment, null, /* @__PURE__ */ createElement(Icon, {
      blueprintIcon: "add",
      style: {
        marginRight: "0.2em",
        position: "relative",
        top: "-0.071em"
      }
    }), props.children ?? formatter("blockRepeater.addNewBlockButton.addBlock")),
    disabled: props.isMutating,
    distinction: "seamless",
    flow: "block",
    justification: "justifyStart"
  }), [formatter, props.isMutating, props.children]);
  return /* @__PURE__ */ createElement(FieldContainer, {
    label: void 0
  }, /* @__PURE__ */ createElement(Dropdown, {
    buttonProps,
    alignment: "center"
  }, ({ requestClose, forceUpdate, update }) => /* @__PURE__ */ createElement(AddNewBlockButtonInner, {
    normalizedBlocks: props.normalizedBlocks,
    createNewEntity: props.createNewEntity,
    isMutating: props.isMutating,
    discriminationField: props.discriminationField,
    requestClose,
    forceUpdate,
    update
  })));
});
AddNewBlockButton.displayName = "AddNewBlockButton";
export { AddNewBlockButton };
//# sourceMappingURL=AddNewBlockButton.js.map
