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


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