import { a3 as D, aC as W, aD as j, aE as k, w as g, a9 as B, a5 as S, cZ as T, aG as A, V as M, X as C, U, H as a, ad as u, I as b, ae as r, af as o, a4 as s, am as $, ag as _, ah as F, aj as O, ai as z, c_ as H, _ as P, aI as G, c$ as L, d0 as X, aH as Z, ar as q } from "./56c67d3b.js";
import { useContext as x, useRef as E, useState as V, useEffect as I } from "react";
import "react-dom";
const J = D.div`
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  .ant-image,
  img {
    width: 100%;
    height: 100%;
  }

  img {
    object-fit: contain;
    pointer-events: auto;
    ${(e) => e.$animationStyle}
  }

  ${(e) => e.$style && K(e.$style)}
`, K = (e) => W`
    img {
      border: ${(l) => e.borderWidth ? e.borderWidth : "1px"} solid ${e.border};
      border-radius: ${e.radius};
      margin: ${e.margin};
      padding: ${e.padding};
      max-width: ${j(e.margin)};
      max-height: ${k(e.margin)};
      rotate: ${e.rotation};
    }

    .ant-image-mask {
      border-radius: ${e.radius};
    }
  `, Q = [q], Y = (e) => {
  const l = E(null), h = E(null), [c, N] = V(0), [d, R] = V(0), w = (t) => {
    t.onload = function() {
      N(t.naturalWidth), R(t.naturalHeight);
    };
  };
  I(() => {
    const t = new Image(0, 0);
    t.src = e.src.value, w(t), t.onerror = function(i) {
      t.src = H, w(t);
    };
  }, [e.src.value]), I(() => {
    d && c && p();
  }, [d, c]);
  const y = (t, i) => {
    const n = l.current, v = n == null ? void 0 : n.getElementsByTagName("div")[0], f = n == null ? void 0 : n.getElementsByTagName("img")[0];
    n.style.height = t, n.style.width = i, v.style.height = t, v.style.width = i, f.style.height = t, f.style.width = i;
  }, p = () => {
    const t = l.current, i = h.current;
    !(t != null && t.clientWidth) || !(t != null && t.clientHeight) || e.autoHeight || !c || ((P.divide(i == null ? void 0 : i.clientWidth, i == null ? void 0 : i.clientHeight) || 0) > (P.divide(Number(c), Number(d)) || 0) ? y("100%", "auto") : y("auto", "100%"));
  };
  return /* @__PURE__ */ a(G, {
    onResize: p,
    render: () => /* @__PURE__ */ a(J, {
      ref: h,
      $style: e.style,
      $animationStyle: e.animationStyle,
      children: /* @__PURE__ */ a("div", {
        ref: l,
        style: e.autoHeight ? {
          width: "100%",
          height: "100%"
        } : void 0,
        children: /* @__PURE__ */ a(L, {
          src: e.src.value,
          referrerPolicy: "same-origin",
          draggable: !1,
          preview: e.supportPreview ? {
            src: e.previewSrc || e.src.value
          } : !1,
          fallback: H,
          onClick: () => e.onEvent("click")
        })
      })
    })
  });
}, ee = {
  src: g(X, "https://temp.im/350x400"),
  onEvent: B(Q),
  style: S(T, "style"),
  animationStyle: S(A, "animationStyle"),
  autoHeight: g(Z, "fixed"),
  supportPreview: M,
  previewSrc: C,
  restrictPaddingOnRotation: g(C, "image")
};
let m = new U(ee, (e) => /* @__PURE__ */ a(Y, {
  ...e
})).setPropertyViewFn((e) => /* @__PURE__ */ u(b, {
  children: [/* @__PURE__ */ a(r, {
    name: o.basic,
    children: e.src.propertyView({
      label: s("image.src")
    })
  }), ["logic", "both"].includes(x($).editorModeStatus) && /* @__PURE__ */ u(r, {
    name: o.interaction,
    children: [e.onEvent.getPropertyView(), _(e), e.supportPreview.propertyView({
      label: s("image.supportPreview"),
      tooltip: s("image.supportPreviewTip")
    }), e.supportPreview.getView() && e.previewSrc.propertyView({
      label: s("image.previewSrc")
    })]
  }), ["layout", "both"].includes(x($).editorModeStatus) && /* @__PURE__ */ u(b, {
    children: [/* @__PURE__ */ a(r, {
      name: o.layout,
      children: e.autoHeight.getPropertyView()
    }), /* @__PURE__ */ a(r, {
      name: o.style,
      children: e.style.getPropertyView()
    }), /* @__PURE__ */ a(r, {
      name: o.animationStyle,
      hasTooltip: !0,
      children: e.animationStyle.getPropertyView()
    })]
  })]
})).build();
m = class extends m {
  autoHeight() {
    return this.children.autoHeight.getView();
  }
};
const ne = F(m, [new O("src", s("image.srcDesc")), z]);
export {
  ne as ImageComp
};
