import { jsx as a } from "react/jsx-runtime";
import { useMemo as b } from "react";
import { useSidebarCollapse as c } from "./hooks/useSidebarCollapse.js";
import { SidebarContext as m } from "./context/sidebarContext.js";
import { c as u } from "../../index-BtlgVD4m.js";
const f = ({
  collapsed: r,
  defaultCollapsed: l,
  onCollapsedChange: s,
  width: d = "240px",
  collapsedWidth: i = "48px",
  className: t,
  children: n
}) => {
  const { collapsed: e, onCollapsedChange: o } = c({
    collapsed: r,
    defaultCollapsed: l,
    onCollapsedChange: s
  }), p = b(() => ({ collapsed: e, onCollapsedChange: o }), [e, o]);
  return /* @__PURE__ */ a(m.Provider, { value: p, children: /* @__PURE__ */ a(
    "aside",
    {
      "data-collapsed": e,
      className: u(
        "group/sidebar",
        "relative",
        "flex",
        "h-full",
        "flex-col",
        "overflow-visible",
        "bg-[var(--base-sidebar-background)]",
        "border-r",
        "border-[var(--base-border)]",
        "transition-[width]",
        "duration-200",
        "ease-in-out",
        t
      ),
      style: { width: e ? i : d },
      children: n
    }
  ) });
};
f.displayName = "Sidebar";
export {
  f as default
};
//# sourceMappingURL=Sidebar.js.map
