import { j as z } from "../../node_modules/react/jsx-runtime.mjs";
import b, { useMemo as o, useRef as C, useEffect as E } from "react";
import "./index.less.mjs";
const y = ({ value: m, zIndex: d = 1, route: p, fixed: n = !0, border: a = !0, safeAreaInsetBottom: t = !0, placeholder: c = !0, onChange: f, children: h }) => {
  const B = o(() => a ? " bitzTabbarBlockBorder" : "", [a]), x = o(() => n ? " bitzTabbarFixedBlock" : "", [n]), T = o(() => t ? " bitzTabbarBlockBottomSafe" : "", [t]), r = C(null);
  E(() => {
    var e, i, u;
    if (c) {
      const l = document.createElement("div");
      let s = ((e = r.current) == null ? void 0 : e.offsetHeight) || 0;
      t && (s += Number.parseInt(getComputedStyle(r.current).getPropertyValue("--safeArea-insetBottom") || "0")), l.style.height = `${s}px`, (u = (i = r.current) == null ? void 0 : i.parentElement) == null || u.appendChild(l);
    }
  }, [c, t]);
  const g = {
    ...p ? {} : {},
    currentName: m,
    onClick: (e) => {
      f(e);
    }
  }, k = (e) => b.cloneElement(e, g);
  return z.jsx("div", { ref: r, className: `bitzTabbarBlock${x}${B}${T}`, style: { zIndex: d }, children: b.Children.map(h, k) });
}, N = y;
export {
  N as default
};
