#!/usr/bin/env node
import {
  useRowScroll
} from "./chunk-WYVDNGJB.js";
import {
  ViewTitle
} from "./chunk-MGNYPVOJ.js";
import {
  CLI_COLORS,
  UI_SYMBOLS
} from "./chunk-6OWHQ7HM.js";
import {
  init_esm_shims
} from "./chunk-DHET7RCE.js";

// src/cli/components/wizard/checkbox-grid.tsx
init_esm_shims();
import { Box, Text, useInput } from "ink";
import { useState } from "react";
import { jsx, jsxs } from "react/jsx-runtime";
var CheckboxGrid = ({
  title,
  subtitle,
  items,
  selectedIds,
  availableHeight = 0,
  onToggle,
  onContinue,
  onBack,
  emptyMessage = "Please select at least one item"
}) => {
  const totalItems = items.length + 1;
  const [focusedIndex, setFocusedIndex] = useState(0);
  useInput((input, key) => {
    if (key.escape) {
      onBack();
      return;
    }
    if (key.upArrow || input === "k") {
      setFocusedIndex((prev) => prev <= 0 ? totalItems - 1 : prev - 1);
      return;
    }
    if (key.downArrow || input === "j") {
      setFocusedIndex((prev) => prev >= totalItems - 1 ? 0 : prev + 1);
      return;
    }
    if (key.return) {
      onContinue();
      return;
    }
    if (input === " ") {
      const item = items[focusedIndex];
      if (item) {
        onToggle(item.id);
      }
    }
  });
  const continueIndex = items.length;
  const effectiveRow = focusedIndex >= items.length ? items.length - 1 : focusedIndex;
  const { scrollEnabled, scrollTop } = useRowScroll({
    focusedIndex: effectiveRow,
    itemCount: items.length,
    availableHeight
  });
  const itemElements = items.map((item, index) => {
    const isFocused = index === focusedIndex;
    const isSelected = selectedIds.includes(item.id);
    const checkbox = isSelected ? "[\u2713]" : "[ ]";
    const pointer = isFocused ? UI_SYMBOLS.CHEVRON : UI_SYMBOLS.CHEVRON_SPACER;
    return /* @__PURE__ */ jsxs(Text, { children: [
      /* @__PURE__ */ jsx(Text, { color: isFocused ? CLI_COLORS.PRIMARY : void 0, children: pointer }),
      /* @__PURE__ */ jsxs(Text, { color: isSelected || isFocused ? CLI_COLORS.PRIMARY : void 0, bold: isFocused, children: [
        " ",
        checkbox,
        " ",
        item.label
      ] }),
      isFocused && /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
        "  ",
        item.description
      ] })
    ] }, item.id);
  });
  const footerElement = selectedIds.length > 0 ? /* @__PURE__ */ jsxs(Text, { children: [
    "\n",
    "Selected: ",
    /* @__PURE__ */ jsx(Text, { color: CLI_COLORS.WARNING, children: selectedIds.join(", ") })
  ] }) : emptyMessage ? /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
    "\n",
    emptyMessage
  ] }) : null;
  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
    /* @__PURE__ */ jsx(ViewTitle, { children: title }),
    subtitle && /* @__PURE__ */ jsx(Text, { dimColor: true, children: subtitle }),
    /* @__PURE__ */ jsx(
      Box,
      {
        flexDirection: "column",
        ...scrollEnabled && { height: availableHeight, overflow: "hidden" },
        children: /* @__PURE__ */ jsx(
          Box,
          {
            flexDirection: "column",
            marginTop: scrollTop > 0 ? -scrollTop : 0,
            ...scrollEnabled && { flexShrink: 0 },
            children: itemElements
          }
        )
      }
    ),
    footerElement
  ] });
};

export {
  CheckboxGrid
};
//# sourceMappingURL=chunk-CIG7IKX3.js.map