"use client";
import { clsx as T } from "../../../clsx/dist/clsx.js";
import * as w from "react";
import { forwardRef as M, useRef as C, useImperativeHandle as N, useState as K, useCallback as B, useEffect as I, useMemo as $, cloneElement as q } from "react";
import A from "../../../../_virtual/throttle.js";
import { isPercent as f } from "../util/DataUtils.js";
import { warn as O } from "../util/LogUtils.js";
function E(t, r) {
  var e = Object.keys(t);
  if (Object.getOwnPropertySymbols) {
    var n = Object.getOwnPropertySymbols(t);
    r && (n = n.filter(function(a) {
      return Object.getOwnPropertyDescriptor(t, a).enumerable;
    })), e.push.apply(e, n);
  }
  return e;
}
function j(t) {
  for (var r = 1; r < arguments.length; r++) {
    var e = arguments[r] != null ? arguments[r] : {};
    r % 2 ? E(Object(e), !0).forEach(function(n) {
      F(t, n, e[n]);
    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(t, Object.getOwnPropertyDescriptors(e)) : E(Object(e)).forEach(function(n) {
      Object.defineProperty(t, n, Object.getOwnPropertyDescriptor(e, n));
    });
  }
  return t;
}
function F(t, r, e) {
  return (r = G(r)) in t ? Object.defineProperty(t, r, { value: e, enumerable: !0, configurable: !0, writable: !0 }) : t[r] = e, t;
}
function G(t) {
  var r = J(t, "string");
  return typeof r == "symbol" ? r : r + "";
}
function J(t, r) {
  if (typeof t != "object" || !t) return t;
  var e = t[Symbol.toPrimitive];
  if (e !== void 0) {
    var n = e.call(t, r);
    if (typeof n != "object") return n;
    throw new TypeError("@@toPrimitive must return a primitive value.");
  }
  return (r === "string" ? String : Number)(t);
}
var Y = /* @__PURE__ */ M((t, r) => {
  var {
    aspect: e,
    initialDimension: n = {
      width: -1,
      height: -1
    },
    width: a = "100%",
    height: s = "100%",
    /*
     * default min-width to 0 if not specified - 'auto' causes issues with flexbox
     * https://github.com/recharts/recharts/issues/172
     */
    minWidth: m = 0,
    minHeight: g,
    maxHeight: l,
    children: P,
    debounce: p = 0,
    id: R,
    className: S,
    onResize: D,
    style: _ = {}
  } = t, d = C(null), v = C();
  v.current = D, N(r, () => d.current);
  var [H, k] = K({
    containerWidth: n.width,
    containerHeight: n.height
  }), b = B((c, h) => {
    k((o) => {
      var i = Math.round(c), u = Math.round(h);
      return o.containerWidth === i && o.containerHeight === u ? o : {
        containerWidth: i,
        containerHeight: u
      };
    });
  }, []);
  I(() => {
    var c = (u) => {
      var y, {
        width: W,
        height: z
      } = u[0].contentRect;
      b(W, z), (y = v.current) === null || y === void 0 || y.call(v, W, z);
    };
    p > 0 && (c = A(c, p, {
      trailing: !0,
      leading: !1
    }));
    var h = new ResizeObserver(c), {
      width: o,
      height: i
    } = d.current.getBoundingClientRect();
    return b(o, i), h.observe(d.current), () => {
      h.disconnect();
    };
  }, [b, p]);
  var x = $(() => {
    var {
      containerWidth: c,
      containerHeight: h
    } = H;
    if (c < 0 || h < 0)
      return null;
    O(f(a) || f(s), `The width(%s) and height(%s) are both fixed numbers,
       maybe you don't need to use a ResponsiveContainer.`, a, s), O(!e || e > 0, "The aspect(%s) must be greater than zero.", e);
    var o = f(a) ? c : a, i = f(s) ? h : s;
    return e && e > 0 && (o ? i = o / e : i && (o = i * e), l && i > l && (i = l)), O(o > 0 || i > 0, `The width(%s) and height(%s) of chart should be greater than 0,
       please check the style of container, or the props width(%s) and height(%s),
       or add a minWidth(%s) or minHeight(%s) or use aspect(%s) to control the
       height and width.`, o, i, a, s, m, g, e), w.Children.map(P, (u) => /* @__PURE__ */ q(u, {
      width: o,
      height: i,
      // calculate the actual size and override it.
      style: j({
        width: o,
        height: i
      }, u.props.style)
    }));
  }, [e, P, s, l, g, m, H, a]);
  return /* @__PURE__ */ w.createElement("div", {
    id: R ? "".concat(R) : void 0,
    className: T("recharts-responsive-container", S),
    style: j(j({}, _), {}, {
      width: a,
      height: s,
      minWidth: m,
      minHeight: g,
      maxHeight: l
    }),
    ref: d
  }, /* @__PURE__ */ w.createElement("div", {
    style: {
      width: 0,
      height: 0,
      overflow: "visible"
    }
  }, x));
});
export {
  Y as ResponsiveContainer
};
