@adyen/adyen-platform-experience-web/dist/es/components/internal/Img/Img.js


import { jsx as n } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
import { useState as p, useRef as y, useEffect as N } from "../../../external/preact/hooks/dist/hooks.module.js";
import E from "classnames";
/* empty css         */
function L(s) {
  const { backgroundUrl: a = "", className: c = "", classNameModifiers: m = [], src: l = "", alt: d = "", showOnError: f = !1 } = s, [i, o] = p(!1), r = y(null), u = () => {
    o(!0);
  }, g = () => {
    o(f);
  }, t = E(
    [c],
    "adyen-pe-image",
    { "adyen-pe-image--loaded": i },
    ...m.map((e) => `adyen-pe-image--${e}`)
  );
  return N(() => {
    const e = a ? new Image() : r.current;
    e && (e.src = a || l, e.onload = u), o(!!(e != null && e.complete));
  }, []), a ? /* @__PURE__ */ n("div", { style: { backgroundUrl: a }, ...s, className: t }) : /* @__PURE__ */ n("img", { ...s, alt: d, ref: r, className: t, onError: g });
}
export {
  L as default
};