// frontend/components/SegmentToggle.tsx — 칸반/리스트(캘린더는 post-MVP) (Phase 3 사용)
import { Icon } from "./Icon";
import type { IconName } from "./icons/paths";
export type SegOption = { id: string; label: string; icon?: IconName };
export function SegmentToggle({
  options,
  value,
  onChange,
}: {
  options: SegOption[];
  value: string;
  onChange: (id: string) => void;
}) {
  return (
    <div className="seg" role="tablist">
      {options.map((o) => (
        <button key={o.id} role="tab" aria-selected={value === o.id} onClick={() => onChange(o.id)}>
          {o.icon && <Icon name={o.icon} />}
          {o.label}
        </button>
      ))}
    </div>
  );
}