import { jsxs, jsx } from 'react/jsx-runtime';
import { CalendarIcon, PlusIcon } from '@heroicons/react/24/outline';
import { cn } from '../../../utils/cn.js';
import { useGanttContext } from './GanttChart.js';
import { Segmented } from '../../core/Segmented/Segmented.js';
import { Button } from '../../core/Button/Button.js';
import 'react';
import { Checkbox } from '../../forms/Checkbox/Checkbox.js';

const ZOOM_OPTIONS = [
    { value: "day", label: "Day" },
    { value: "week", label: "Week" },
    { value: "quarter", label: "Quarter" },
    { value: "month", label: "Month" },
    { value: "year", label: "Year" },
];
const GanttToolbar = () => {
    const { theme, zoom, setZoom, hideCompleted, setHideCompleted, onGroupAdd, todayOffset, dayWidth, readonly, } = useGanttContext();
    const handleScrollToToday = () => {
        const container = document.querySelector("[data-gantt-chart-scroll]");
        if (!container || todayOffset === null)
            return;
        const targetScroll = todayOffset * dayWidth - container.clientWidth / 2;
        container.scrollTo({ left: targetScroll, behavior: "smooth" });
    };
    return (jsxs("div", { className: cn(theme.toolbarStyle), children: [jsxs("div", { className: "flex items-center gap-3", children: [todayOffset !== null && (jsxs(Button, { variant: "outline", color: "neutral", size: "sm", onClick: handleScrollToToday, children: [jsx(CalendarIcon, { className: "size-4" }), "Today"] })), jsx(Segmented, { value: zoom, onChange: (val) => setZoom(val), size: "sm", children: ZOOM_OPTIONS.map((opt) => (jsx(Segmented.Item, { value: opt.value, children: opt.label }, opt.value))) }), jsx(Checkbox, { id: "gantt-hide-completed", name: "hideCompleted", value: "hideCompleted", checked: hideCompleted, onChange: (checked) => setHideCompleted(checked), label: "Hide completed", size: "sm" })] }), jsx("div", { className: "flex items-center gap-2", children: onGroupAdd && !readonly && (jsxs(Button, { variant: "soft", size: "sm", onClick: onGroupAdd, children: [jsx(PlusIcon, { className: "size-3.5" }), "Add group"] })) })] }));
};

export { GanttToolbar };
