'use strict';
import { jsx } from 'react/jsx-runtime';
import { Icon, iconSizes, iconNames } from '../icon/Icon.js';
import { wellKnownPositions } from '../../../base-repo/constants/tools-constants.js';
import { Tooltip } from '../tooltip/Tooltip.js';
import { elements } from '../../../fd-toolbox/constants/elements.js';

var __defProp = Object.defineProperty;
var __name = (target, value) => __defProp(target, "name", {
  value,
  configurable: true
});
function SaveStatus({
  saved
}) {
  return /* @__PURE__ */jsx("div", {
    className: "flex size-5 items-center justify-center",
    children: saved ? /* @__PURE__ */jsx(Tooltip, {
      content: "Changes saved",
      side: wellKnownPositions.bottom,
      children: /* @__PURE__ */jsx("div", {
        children: /* @__PURE__ */jsx(Icon, {
          name: iconNames.check,
          color: "text-fd-green-accent",
          id: elements.view.viewSaved,
          size: iconSizes.medium
        })
      })
    }) : /* @__PURE__ */jsx(Tooltip, {
      content: "Saving changes",
      side: wellKnownPositions.bottom,
      children: /* @__PURE__ */jsx("div", {
        children: /* @__PURE__ */jsx(Icon, {
          name: iconNames.refresh,
          className: "animate-spin",
          id: elements.view.viewSaving
        })
      })
    })
  });
}
__name(SaveStatus, "SaveStatus");

export { SaveStatus };
