import { jsx as o, jsxs as s } from "@emotion/react/jsx-runtime";
import d from "../../hooks/useSideBar/index.js";
import { useComponentSize as a } from "../../../../hooks/useComponentSize/index.js";
import { ContentComponentRootStyled as c, ContainerTreeItemsHeaderFooterStyled as f } from "../../slots/SideBarSlots.js";
import { TreeGroupItems as C } from "../TreeGroupItems/index.js";
import l from "../FooterComponent/index.js";
import { HeaderComponent as u } from "../HeaderComponent/HeaderComponent.js";
const y = () => {
  const { anchored: e, onToggleAnchored: r, expandedWidth: n, size: m, variant: i } = d(), t = {
    expandedWidth: n,
    anchored: e,
    variant: i
  }, { currentSize: p } = a(m);
  return /* @__PURE__ */ o(c, { ownerState: t, children: /* @__PURE__ */ s(f, { ownerState: t, children: [
    /* @__PURE__ */ o(u, {}),
    /* @__PURE__ */ o(C, { size: p }),
    /* @__PURE__ */ o(l, { onToggleAnchored: r, anchored: e })
  ] }) });
};
export {
  y as default
};
