/**
 * Section sidebar component showing sections with selected items
 */
'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { HiFolder } from 'react-icons/hi';
/**
 * SectionSidebar - Left sidebar showing sections with selected items
 */
export function SectionSidebar({ sections, active_section, on_section_click, }) {
    if (sections.length === 0) {
        return (_jsx("div", { className: "p-4 text-sm text-muted-foreground", children: "No sections selected yet." }));
    }
    return (_jsxs("div", { className: "space-y-1 p-2", children: [_jsx("div", { className: "px-2 py-1 text-xs font-semibold text-muted-foreground uppercase tracking-wider", children: "Sections" }), sections.map((section, index) => (_jsxs("button", { onClick: () => on_section_click(section.section_name), className: `
            w-full flex items-center gap-2 px-3 py-2 rounded-md text-sm text-left transition-colors
            ${active_section === section.section_name
                    ? 'bg-primary text-primary-foreground'
                    : 'hover:bg-muted text-foreground'}
          `, children: [_jsx(HiFolder, { className: "h-4 w-4 flex-shrink-0" }), _jsx("span", { className: "flex-1 truncate", children: section.section_name }), _jsx("span", { className: `
            text-xs px-1.5 py-0.5 rounded-full
            ${active_section === section.section_name
                            ? 'bg-primary-foreground/20 text-primary-foreground'
                            : 'bg-muted text-muted-foreground'}
          `, children: section.items.length })] }, `${section.section_name}_${index}`)))] }));
}
//# sourceMappingURL=section_sidebar.js.map