import { jsx as g } from "react/jsx-runtime";
import { useRef as o, useState as h, useEffect as m } from "react";
import '../../assets/index5.css';const y = "_image_14j8z_1", S = {
  image: y
};
function x({
  fadeDurationMs: r = 250,
  showOnError: u = !0,
  onLoad: a,
  onError: c,
  style: f,
  ...t
}) {
  const i = o(null), [l, s] = h(!1);
  m(() => {
    s(!1);
  }, [t.src, t.srcSet]), m(() => {
    const e = i.current;
    e && e.complete && e.naturalWidth > 0 && s(!0);
  }, [t.src, t.srcSet]);
  const n = (e) => {
    s(!0), a == null || a(e);
  }, d = (e) => {
    u && s(!0), c == null || c(e);
  };
  return /* @__PURE__ */ g("img", { ...t, className: S.image, onLoad: n, onError: d, ref: i, style: {
    ...f,
    opacity: l ? 1 : 0,
    "--duration-override": `${r}ms`
  }, "data-component": "image" });
}
export {
  x as Image
};
//# sourceMappingURL=index.js.map
