import { t as e } from "../component-x2UxdKEC.js";
import { t } from "../utils-B7XIe3qq.js";
import * as n from "react";
import { jsx as r } from "react/jsx-runtime";
//#region src/react/sidebar.tsx
function i({ activeItemId: i, onNavigate: a, onCollapse: o, className: s, ...c }) {
	let l = n.useRef(null), u = n.useRef(null), d = n.useRef(a), f = n.useRef(o);
	return d.current = a, f.current = o, n.useEffect(() => {
		if (!(typeof document > "u" || !l.current)) return u.current = new e({
			...c,
			container: l.current,
			onNavigate: (e) => {
				d.current?.(e);
			},
			onCollapse: (e) => {
				f.current?.(e);
			}
		}), () => {
			u.current?.destroy(), u.current = null;
		};
	}, []), n.useEffect(() => {
		!u.current || i === void 0 || u.current.setActive(i);
	}, [i]), /* @__PURE__ */ r("div", {
		ref: l,
		"data-slot": "sidebar",
		className: t(s)
	});
}
i.displayName = "Sidebar";
//#endregion
export { i as Sidebar };

//# sourceMappingURL=sidebar.js.map