'use strict';
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
import { Icon, iconNames } from '../../../fd-component-toolbox/icon/Icon.js';
import { Button } from '../../../fd-component-toolbox/button/Button.js';
import { Spinner } from '../../../fd-component-toolbox/spinner/Spinner.js';
import { alignPositions } from '../../../../base-repo/constants/tools-constants.js';
import { imageActionLabels } from '../../constants/image-action-labels.js';

var __defProp = Object.defineProperty;
var __name = (target, value) => __defProp(target, "name", {
  value,
  configurable: true
});
const buttonLabels = {
  upload: imageActionLabels.upload,
  edit: imageActionLabels.edit,
  delete: imageActionLabels.delete
};
function EditImageActionMenu({
  onChange,
  onDelete,
  imageUrl,
  loading
}) {
  return /* @__PURE__ */jsx("div", {
    className: "absolute top-1/2 left-1/2 hidden -translate-x-1/2 -translate-y-1/2 gap-2 group-hover:flex",
    children: loading ? /* @__PURE__ */jsx(Spinner, {}) : /* @__PURE__ */jsx(EditImageActionMenuContent, {
      onChange,
      onDelete,
      imageUrl
    })
  });
}
__name(EditImageActionMenu, "EditImageActionMenu");
function EditImageActionMenuContent({
  onChange,
  onDelete,
  imageUrl
}) {
  if (imageUrl) {
    return /* @__PURE__ */jsxs(Fragment, {
      children: [/* @__PURE__ */jsx(Button, {
        variant: "icon",
        onClick: onChange,
        className: "bg-muted-foreground/45 flex size-3 items-center justify-center rounded-sm p-2.5",
        tooltipText: buttonLabels.edit,
        tooltipClassName: "mt-2",
        tooltipAlign: alignPositions.start,
        children: /* @__PURE__ */jsx(Icon, {
          color: "text-fd-tertiary-50",
          className: "absolute",
          name: iconNames.edit
        })
      }), /* @__PURE__ */jsx(Button, {
        variant: "icon",
        onClick: onDelete,
        className: "bg-muted-foreground/45 flex size-3 items-center justify-center rounded-sm p-2.5",
        tooltipClassName: "mt-2",
        tooltipText: buttonLabels.delete,
        children: /* @__PURE__ */jsx(Icon, {
          className: "absolute",
          name: iconNames.trash,
          color: "text-fd-tertiary-50"
        })
      })]
    });
  } else {
    return /* @__PURE__ */jsx(Button, {
      onClick: onChange,
      variant: "icon",
      className: "bg-muted-foreground/45 flex size-6 items-center justify-center rounded-full",
      tooltipText: buttonLabels.upload,
      tooltipClassName: "mt-2",
      children: /* @__PURE__ */jsx(Icon, {
        color: "text-fd-tertiary-50",
        className: "absolute",
        name: iconNames.upload
      })
    });
  }
}
__name(EditImageActionMenuContent, "EditImageActionMenuContent");

export { EditImageActionMenu };
