"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.SidebarItemCollapsible = SidebarItemCollapsible;
exports.SidebarItemCollapsibleTrigger = SidebarItemCollapsibleTrigger;
exports.SidebarItemCollapsibleContent = SidebarItemCollapsibleContent;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = __importDefault(require("react"));
const utils_1 = require("../../../lib/utils");
const react_collapsible_1 = require("@radix-ui/react-collapsible");
const lucide_react_1 = require("lucide-react");
const sidebar_provider_1 = require("./sidebar-provider");
const separator_1 = require("../separator");
const sidebar_item_button_1 = require("./sidebar-item-button");
const button_1 = require("../button");
const sidebar_item_icon_button_1 = require("./sidebar-item-icon-button");
function SidebarItemCollapsible({ name, className, ...props }) {
    const { isCollapsed, getItemCollapsed, setItemCollapsed } = (0, sidebar_provider_1.useSidebar)();
    const [open, setOpen] = react_1.default.useState(name ? getItemCollapsed(name) : false);
    const handleOpenChange = (open) => {
        setOpen(open);
        if (name) {
            setItemCollapsed(name, open);
        }
    };
    react_1.default.useEffect(() => {
        if (name) {
            setOpen(getItemCollapsed(name));
        }
    }, [name, getItemCollapsed]);
    return ((0, jsx_runtime_1.jsx)(react_collapsible_1.Collapsible, { open: open, onOpenChange: handleOpenChange, "data-slot": "sidebar-item-collapsible", className: (0, utils_1.cn)({
            'rounded-md': isCollapsed
        }, className), ...props }));
}
function SidebarItemCollapsibleTrigger({ className, icon, title, children: _children, ...props }) {
    const { isCollapsed } = (0, sidebar_provider_1.useSidebar)();
    return ((0, jsx_runtime_1.jsxs)(react_collapsible_1.CollapsibleTrigger, { "data-slot": "sidebar-item-collapsible-trigger", className: (0, utils_1.cn)('flex w-full flex-row p-0', 'transition-all hover:underline [&[data-state=open]>svg]:rotate-90', (0, button_1.buttonVariants)({
            variant: 'outline',
            fullWidth: true,
            size: 'small'
        }), {
            'size-10': isCollapsed
        }, className), ...props, children: [isCollapsed && ((0, jsx_runtime_1.jsx)(sidebar_item_icon_button_1.SidebarItemIconButton, { title: title, icon: icon, href: "", inactive: true })), !isCollapsed && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(sidebar_item_button_1.SidebarItemButton, { title: title, icon: icon, href: '', inactive: true }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "text-foreground mr-1 size-6 shrink-0 cursor-pointer transition-transform duration-200" })] }))] }));
}
function SidebarItemCollapsibleContent({ className, children, ...props }) {
    const { isCollapsed } = (0, sidebar_provider_1.useSidebar)();
    return ((0, jsx_runtime_1.jsx)(react_collapsible_1.CollapsibleContent, { "data-slot": "sidebar-item-collapsible-content", className: (0, utils_1.cn)('mt-1 flex flex-col gap-1', 'data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down overflow-hidden transition-all duration-200 ease-in-out', {
            'items-center': isCollapsed
        }, className), ...props, children: isCollapsed ? (children) : ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-stretch gap-3", children: [(0, jsx_runtime_1.jsx)(separator_1.Separator, { className: "ml-5 h-auto", orientation: "vertical" }), (0, jsx_runtime_1.jsx)("div", { className: "flex w-full flex-col gap-1", children: children })] })) }));
}
