import { jsxs as A, jsx as d } from "react/jsx-runtime";
import R, { memo as oe, forwardRef as re, useState as f, useRef as ne } from "react";
import { noop as T, head as E, isArray as L } from "es-toolkit/compat";
import ie from "tiny-invariant";
import g from "../../utils/classNames.js";
import de from "./TreeCategory.js";
import u from "../resizer/Resizer.js";
import ae from "./TreeSidebar.js";
import ce from "../../utils/getWidthInBoundaries.js";
import le from "../../utils/mergeRefs.js";
import fe from "../../hooks/usePrevious.js";
import me from "../smoothScrollbars/SmoothScrollbars.js";
const pe = 350, he = 100, ye = 0, m = {
  MODE_FLY: "fly",
  MODE_FLUID: "fluid"
}, b = (e) => E(e?.current?.getElementsByClassName("AssetTreeBody")), Te = (e, o) => L(e) ? e.find((t) => t && t.props.id === o) : e, ue = (e, o) => R.Children.map(e, (t) => {
  const p = g(
    "TreeOffscreenWrapper",
    t && t.props.id !== o && "position-offscreen pointer-events-none"
  );
  return /* @__PURE__ */ d("div", { className: p, children: t });
}), ge = (e) => R.isValidElement(e) && e.type === de, Re = oe(
  re((e, o) => {
    const {
      className: t,
      resizable: p = !0,
      width: a = pe,
      minWidth: M = he,
      maxWidth: C = ye,
      height: D,
      bordered: I = !1,
      currentCategoryId: r,
      isOpen: n = !0,
      useOffscreen: O = !1,
      fly: i = !1,
      onCategoryChange: S = T,
      onToggleTree: N = T,
      onResizeEnd: _ = T,
      children: c = [],
      ...w
    } = e, W = (s) => s ? m.MODE_FLY : m.MODE_FLUID, [F, z] = f(a), [x, v] = f(!1), [B, H] = f(W(i)), h = ne(null), P = le([o, h]);
    fe(a) !== a && z(a);
    const [U, j] = f(i);
    U !== i && (H(W(i)), j(i));
    const l = R.Children.toArray(c);
    ie(l.every(ge), 'AssetTree only excepts children of type "TreeCategory"');
    const Y = g(
      "AssetTree",
      t,
      !n && "closed",
      I && "border",
      B === m.MODE_FLY ? "fly" : "fluid"
    ), k = g("AssetTreeResizeLimit", x && "display-block"), G = { left: C || window.innerWidth * 0.5 }, V = E(l), X = r ? Te(l, r) : V, Z = {
      width: F,
      height: D
    }, y = () => N(!n), q = (s) => {
      S(s), n ? n && r === s && y() : y();
    }, J = (s) => {
      const $ = window.innerWidth * 0.5, ee = C || $;
      z((se) => {
        const te = se - s;
        return ce(M, ee, te);
      });
    }, K = () => {
      const s = b(h);
      s && s.classList.add("pointer-events-none"), v(!0);
    }, Q = () => {
      const s = b(h);
      s && s.classList.remove("pointer-events-none"), v(!1), _();
    };
    return /* @__PURE__ */ A("div", { ...w, className: Y, style: Z, ref: P, children: [
      /* @__PURE__ */ d("div", { className: k, style: G }),
      /* @__PURE__ */ A("div", { className: "AssetTreeContent", children: [
        /* @__PURE__ */ d(
          ae,
          {
            onSelectCategory: q,
            currentCategoryId: r,
            onClick: y,
            children: L(c) ? c : [c]
          }
        ),
        /* @__PURE__ */ d(me, { slideIn: !0, className: "AssetTreeBody", children: O ? ue(l, r) : X })
      ] }),
      p && n && /* @__PURE__ */ d(
        u,
        {
          onResizeStart: K,
          onResize: J,
          onResizeEnd: Q,
          direction: u.HORIZONTAL,
          position: u.RIGHT
        }
      )
    ] });
  })
);
Object.assign(Re, m);
export {
  Re as default
};
//# sourceMappingURL=AssetTree.js.map
