import { jsxs, jsx } from 'react/jsx-runtime';
import React__default from 'react';
import { motion } from 'motion/react';
import { ChevronRightIcon, PlusIcon } from '@heroicons/react/24/outline';
import { cn } from '../../../utils/cn.js';
import { useGanttContext } from './GanttChart.js';
import { chevronVariants } from './GanttChart.animations.js';

const GanttTableGroupRow = React__default.memo(({ row, }) => {
    const { theme, collapsedGroups, toggleGroup, onTaskAdd, rowHeight, readonly } = useGanttContext();
    const isCollapsed = collapsedGroups.includes(row.group.id);
    return (jsxs("div", { className: cn(theme.tableGroupRowStyle, "group"), style: { height: rowHeight }, onClick: () => toggleGroup(row.group.id), onKeyDown: (e) => {
            if (e.key === "Enter" || e.key === " ") {
                e.preventDefault();
                toggleGroup(row.group.id);
            }
        }, role: "button", tabIndex: 0, "aria-expanded": !isCollapsed, "aria-label": `${row.group.title} — ${row.completedCount} of ${row.taskCount} completed`, children: [jsxs("div", { className: "flex items-center gap-2 px-3 flex-1 min-w-0", children: [jsx(motion.div, { variants: chevronVariants, animate: isCollapsed ? "collapsed" : "open", children: jsx(ChevronRightIcon, { className: "size-4 text-[var(--color-text-muted)]" }) }), jsx("div", { className: "size-2.5 rounded-full shrink-0", style: { backgroundColor: row.group.color } }), jsx("span", { className: "font-medium text-[var(--color-text-primary)] truncate", children: row.group.title }), jsxs("span", { className: "text-sm text-[var(--color-text-muted)] shrink-0", children: [row.completedCount, "/", row.taskCount] })] }), onTaskAdd && !readonly && (jsx("button", { className: "p-1 mr-2 rounded hover:bg-[var(--color-background-tertiary)] text-[var(--color-text-muted)] opacity-0 group-hover:opacity-100 focus:opacity-100 transition-opacity", "aria-label": `Add task to ${row.group.title}`, onClick: (e) => {
                    e.stopPropagation();
                    onTaskAdd(row.group.id);
                }, children: jsx(PlusIcon, { className: "size-4" }) }))] }));
});

export { GanttTableGroupRow };
