import { jsxs as c, Fragment as G, jsx as s } from "react/jsx-runtime";
import { useState as i, useRef as P, useEffect as b } from "react";
import { motion as We } from "motion/react";
import { noop as p } from "es-toolkit/function";
import { toNumber as V } from "es-toolkit/compat";
import m from "../../utils/classNames.js";
import Oe from "./SidebarFooter.js";
import ge from "./SidebarBackdrop.js";
import ve from "./SidebarFullscreenToggle.js";
import ze from "./SidebarCloseButton.js";
import E from "../resizer/Resizer.js";
import He from "../../hooks/useWindowResize.js";
import Be from "../../hooks/useEsc.js";
import ke from "../../utils/getWidthInBoundaries.js";
import xe from "../smoothScrollbars/SmoothScrollbars.js";
const Ue = 350, Ae = 100, Ye = 800, j = 0, Ge = 400, Pe = 800, Ve = 0.14, je = 500, C = {
  LEFT: "left",
  RIGHT: "right"
}, D = {
  MODE_FLY: "fly",
  MODE_FLUID: "fluid"
}, Xe = {
  sidebarEnter: ({ fromRight: n }) => ({
    x: n ? "100%" : "-100%",
    opacity: 0
  }),
  sidebarVisible: ({ fromRight: n, closed: r }) => ({
    x: r ? n ? "100%" : "-100%" : 0,
    opacity: r ? 0 : 1,
    display: r ? "none" : "block"
  }),
  sidebarExit: ({ fromRight: n }) => ({
    x: n ? "100%" : "-100%",
    opacity: 0
  })
}, t = (n) => {
  const {
    fly: r = !1,
    closed: o = !1,
    title: X = "",
    footer: Z,
    resizable: q = !1,
    position: F,
    width: l = Ue,
    minWidth: K = Ae,
    maxWidth: R = Ye,
    hasBackdrop: J = !1,
    hasSmoothScrollbar: Q = !1,
    makeBackdropVisible: $ = !1,
    enableFullscreenToggle: T = !1,
    fullscreenToggleTooltip: ee,
    openInFullscreen: se = !1,
    showHeaderBorder: te = !1,
    disableClose: M = !1,
    bodyRef: _,
    headerButtons: w,
    switchModeBreakpoint: y = j,
    onClose: oe = p,
    onResizeEnd: ie = p,
    onFullScreenChange: W = p,
    onBackdropClick: ne = p,
    disableEsc: re = !1,
    titleClassName: ae = "",
    bodyClassName: le = "",
    headerClassName: de = "",
    footerClassName: ce = "",
    backdropClassName: me = "",
    className: fe = "",
    children: O,
    ...ue
  } = n, [he, g] = i(V(l)), [S, v] = i(r ? t.MODE_FLY : t.MODE_FLUID), [a, z] = i(se), [be, H] = i(!1), [I, pe] = i(!1), [N, Ee] = i(F === C.RIGHT), f = P(null), B = P(null);
  b(() => {
    f.current && S === t.MODE_FLY && f.current.parentNode?.className.includes("right") && Ee(!0);
  }, [f.current, S]);
  const [k, Te] = i(o);
  k !== o && Te(o);
  const [Se, Ie] = i(l);
  Se !== l && (console.log("update internal width"), g(V(l)), Ie(l)), He(() => u(), je), b(() => u(), []), b(() => {
    o || setTimeout(() => u());
  }, [o]), b(() => {
    const e = document.querySelector(".module-content");
    e && (B.current = e);
  }, []), Be(() => {
    !re && T && a && (z(!1), W(!1));
  });
  const u = () => {
    const e = B.current?.clientWidth;
    if (r || y === j)
      return;
    const L = e && e <= Ge, d = e && e > Pe, h = window.innerWidth <= y;
    if (L || h) {
      v(t.MODE_FLY);
      return;
    }
    if (d && !h) {
      v(t.MODE_FLUID);
      return;
    }
  }, Ne = (e) => {
    const L = I, d = window.innerWidth * 0.5, h = R || d;
    g((A) => {
      const ye = F === t.RIGHT ? A + e : A - e, Y = ke(K, h, ye);
      return pe(Y === d), L && !I ? d : Y;
    }), u();
  }, Le = () => {
    document.body?.classList.add("pointer-events-none"), H(!0);
  }, Ce = () => {
    document.body?.classList.remove("pointer-events-none"), H(!1), ie();
  }, De = () => {
    const e = !a;
    z(e), W(e);
  }, Fe = m(
    "Sidebar",
    fe,
    o && "closed",
    a && "width-100vw sidebar-fullscreen",
    I && !a && "max-width-50vw width-50vw",
    S === D.MODE_FLY || a ? "fly" : "fluid"
  ), Re = m("SidebarHeader", de, te && "show-border"), Me = m("SidebarTitle", ae), x = m("SidebarBody", le), _e = m("SidebarResizeLimit", be && "display-block"), U = R || window.innerWidth * 0.5, we = /* @__PURE__ */ c(G, { children: [
    /* @__PURE__ */ s("div", { className: _e, style: N ? { right: U } : { left: U } }),
    /* @__PURE__ */ c("div", { className: "SidebarContent", children: [
      /* @__PURE__ */ c("div", { className: Re, children: [
        /* @__PURE__ */ s("div", { className: Me, children: X }),
        /* @__PURE__ */ c("div", { className: "SidebarButtons non-printable close", children: [
          w,
          T && /* @__PURE__ */ s(
            ve,
            {
              isFullscreen: a,
              onClick: De,
              tooltip: ee
            }
          ),
          !M && (w || T) && /* @__PURE__ */ s("div", { className: "SidebarButtons-spacer" }),
          !M && /* @__PURE__ */ s(ze, { onClick: oe })
        ] })
      ] }),
      Q ? /* @__PURE__ */ s(xe, { slideIn: !0, className: x, ref: _, children: O }) : /* @__PURE__ */ s("div", { className: x, ref: _, children: O }),
      /* @__PURE__ */ s(Oe, { footer: Z, className: ce })
    ] }),
    q && /* @__PURE__ */ s(
      E,
      {
        onResizeStart: Le,
        onResize: Ne,
        onResizeEnd: Ce,
        direction: E.HORIZONTAL,
        position: N ? E.LEFT : E.RIGHT
      }
    )
  ] });
  return /* @__PURE__ */ c(G, { children: [
    /* @__PURE__ */ s(
      We.div,
      {
        ...ue,
        initial: k && "sidebarEnter",
        animate: "sidebarVisible",
        exit: "sidebarExit",
        variants: Xe,
        custom: { fromRight: N, closed: o },
        transition: { duration: Ve },
        className: Fe,
        style: { width: he },
        ref: f,
        children: we
      }
    ),
    J && !o && /* @__PURE__ */ s(
      ge,
      {
        className: me,
        makeBackdropVisible: $,
        onClick: ne
      }
    )
  ] });
};
t.LEFT = C.LEFT;
t.RIGHT = C.RIGHT;
t.MODE_FLY = D.MODE_FLY;
t.MODE_FLUID = D.MODE_FLUID;
export {
  t as default
};
//# sourceMappingURL=Sidebar.js.map
