// packages/components/src/validated-form-controls/validity-indicator.tsx
import clsx from "clsx";
import { error, published } from "@wordpress/icons";
import Icon from "../icon/index.js";
import Spinner from "../spinner/index.js";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
function ValidityIndicator({
  type,
  message
}) {
  const ICON = {
    valid: published,
    invalid: error
  };
  return /* @__PURE__ */ _jsxs("p", {
    className: clsx("components-validated-control__indicator", `is-${type}`),
    children: [type === "validating" ? /* @__PURE__ */ _jsx(Spinner, {
      className: "components-validated-control__indicator-spinner"
    }) : /* @__PURE__ */ _jsx(Icon, {
      className: "components-validated-control__indicator-icon",
      icon: ICON[type],
      size: 16,
      fill: "currentColor"
    }), message]
  });
}
export {
  ValidityIndicator
};
//# sourceMappingURL=validity-indicator.js.map
