import A from "../../../@babel/runtime/helpers/esm/toConsumableArray.mjs";
import a, { useEffect as B } from "react";
import "../../../rc-util/es/hooks/useLayoutEffect.mjs";
import "../../../rc-util/node_modules/react-is/index.mjs";
import "../../../react-dom/index.mjs";
import "../../../@rc-component/mutate-observer/es/wrapper.mjs";
import mt from "../../../@rc-component/mutate-observer/es/useMutateObserver.mjs";
import ct from "../../../classnames/index.mjs";
import "../../../@ant-design/cssinjs/es/extractStyle.mjs";
import "../../../@ant-design/cssinjs/es/hooks/useCacheToken.mjs";
import "../../../@ant-design/cssinjs/es/StyleContext.mjs";
import "../../../@ant-design/cssinjs/es/theme/createTheme.mjs";
import "../../../rc-util/es/warning.mjs";
import "../../../@ant-design/cssinjs/es/theme/ThemeCache.mjs";
import "../../../@ant-design/cssinjs/es/hooks/useCompatibleInsertionEffect.mjs";
import "../../../@ant-design/cssinjs/es/hooks/useEffectCleanupRegister.mjs";
import "../../../@ant-design/cssinjs/es/hooks/useHMR.mjs";
import "../../../@ant-design/cssinjs/es/transformers/legacyLogicalProperties.mjs";
import lt from "../theme/useToken.mjs";
import pt from "./context.mjs";
import ft, { FontGap as ut } from "./useClips.mjs";
import dt from "./useRafDebounce.mjs";
import gt from "./useWatermark.mjs";
import { reRendering as ht, getPixelRatio as kt } from "./utils.mjs";
function G(l, s) {
  return l.size === s.size ? l : s;
}
const I = 100, O = 100, X = (l) => {
  var s, h;
  const {
    /**
     * The antd content layer zIndex is basically below 10
     * https://github.com/ant-design/ant-design/blob/6192403b2ce517c017f9e58a32d58774921c10cd/components/style/themes/default.less#L335
     */
    zIndex: k = 9,
    rotate: _ = -22,
    width: p,
    height: f,
    image: u,
    content: i,
    font: Y = {},
    style: H,
    className: U,
    rootClassName: j,
    gap: V = [I, O],
    offset: m,
    children: N,
    inherit: q = !0
  } = l, [, $] = lt(), {
    color: z = $.colorFill,
    fontSize: v = $.fontSizeLG,
    fontWeight: T = "normal",
    fontStyle: D = "normal",
    fontFamily: x = "sans-serif",
    textAlign: P = "center"
  } = Y, [y = I, W = O] = V, E = y / 2, S = W / 2, M = (s = m == null ? void 0 : m[0]) !== null && s !== void 0 ? s : E, C = (h = m == null ? void 0 : m[1]) !== null && h !== void 0 ? h : S, J = a.useMemo(() => {
    const t = {
      zIndex: k,
      position: "absolute",
      left: 0,
      top: 0,
      width: "100%",
      height: "100%",
      pointerEvents: "none",
      backgroundRepeat: "repeat"
    };
    let e = M - E, o = C - S;
    return e > 0 && (t.left = `${e}px`, t.width = `calc(100% - ${e}px)`, e = 0), o > 0 && (t.top = `${o}px`, t.height = `calc(100% - ${o}px)`, o = 0), t.backgroundPosition = `${e}px ${o}px`, t;
  }, [k, M, E, C, S]), [b, K] = a.useState(), [F, L] = a.useState(/* @__PURE__ */ new Set()), w = a.useMemo(() => {
    const t = b ? [b] : [];
    return [].concat(t, A(Array.from(F)));
  }, [b, F]), Q = (t) => {
    let e = 120, o = 64;
    if (!u && t.measureText) {
      t.font = `${Number(v)}px ${x}`;
      const c = Array.isArray(i) ? i : [i], g = c.map((n) => {
        const r = t.measureText(n);
        return [r.width, r.fontBoundingBoxAscent + r.fontBoundingBoxDescent];
      });
      e = Math.ceil(Math.max.apply(Math, A(g.map((n) => n[0])))), o = Math.ceil(Math.max.apply(Math, A(g.map((n) => n[1])))) * c.length + (c.length - 1) * ut;
    }
    return [p ?? e, f ?? o];
  }, Z = ft(), [d, tt] = a.useState(null), R = dt(() => {
    const e = document.createElement("canvas").getContext("2d");
    if (e) {
      const o = kt(), [c, g] = Q(e), n = (r) => {
        const [st, it] = Z(r || "", _, o, c, g, {
          color: z,
          fontSize: v,
          fontStyle: D,
          fontWeight: T,
          fontFamily: x,
          textAlign: P
        }, y, W);
        tt([st, it]);
      };
      if (u) {
        const r = new Image();
        r.onload = () => {
          n(r);
        }, r.onerror = () => {
          n(i);
        }, r.crossOrigin = "anonymous", r.referrerPolicy = "no-referrer", r.src = u;
      } else
        n(i);
    }
  }), [et, ot, rt] = gt(J);
  B(() => {
    d && w.forEach((t) => {
      et(d[0], d[1], t);
    });
  }, [d, w]), mt(w, (t) => {
    t.forEach((e) => {
      ht(e, rt) && R();
    });
  }), B(R, [_, k, p, f, u, i, z, v, T, D, x, P, y, W, M, C]);
  const nt = a.useMemo(() => ({
    add: (t) => {
      L((e) => {
        const o = new Set(e);
        return o.add(t), G(e, o);
      });
    },
    remove: (t) => {
      ot(t), L((e) => {
        const o = new Set(e);
        return o.delete(t), G(e, o);
      });
    }
  }), []), at = q ? /* @__PURE__ */ a.createElement(pt.Provider, {
    value: nt
  }, N) : N;
  return /* @__PURE__ */ a.createElement("div", {
    ref: K,
    className: ct(U, j),
    style: Object.assign({
      position: "relative"
    }, H)
  }, at);
};
process.env.NODE_ENV !== "production" && (X.displayName = "Watermark");
const Yt = X;
export {
  Yt as default
};
