// @bun
import {
  keyHints
} from "./chunk-bexyahs9.js";
import {
  bind,
  bold,
  box,
  fg,
  getActiveTheme,
  onKey,
  signal,
  t,
  text
} from "./chunk-m2h26j5f.js";

// src/components/select.ts
function select(renderer, scope, props) {
  const { options, initialSelected, onSubmit, onCancel } = props;
  const theme = getActiveTheme();
  const startIndex = initialSelected ? Math.max(0, options.findIndex((opt) => opt.id === initialSelected)) : 0;
  const focused = signal(startIndex);
  const rows = [];
  options.forEach((option, index) => {
    const label = text(renderer, "");
    scope.add(bind(() => {
      label.content = focused() === index ? t`${fg(theme.accent.cyan)(bold(`${theme.symbols.pointer} ${option.label}`))}` : t`  ${fg(theme.text.primary)(option.label)}`;
    }, [focused]));
    const rowChildren = [box(renderer, {}, [label])];
    if (option.description) {
      const descLines = option.description.split(`
`).map((line) => {
        const node = text(renderer, "");
        scope.add(bind(() => {
          node.content = focused() === index ? t`${fg(theme.text.dim)(line)}` : t`${fg(theme.text.dimmer)(line)}`;
        }, [focused]));
        return node;
      });
      rowChildren.push(box(renderer, { paddingLeft: 4, flexDirection: "column" }, descLines));
    }
    rows.push(box(renderer, { flexDirection: "column", marginBottom: 1 }, rowChildren));
  });
  const hints = [
    { key: "\u2191\u2193", label: "navigate" },
    { key: "Enter", label: "select" }
  ];
  if (onCancel)
    hints.push({ key: "Esc", label: "cancel" });
  rows.push(box(renderer, {}, [keyHints(renderer, hints)]));
  scope.add(onKey(renderer, (key) => {
    if (key.name === "escape" && onCancel) {
      onCancel();
      return;
    }
    if (key.name === "return" && options.length > 0) {
      onSubmit(options[focused()].value);
      return;
    }
    if (key.name === "up") {
      focused.set(focused() > 0 ? focused() - 1 : options.length - 1);
    }
    if (key.name === "down") {
      focused.set(focused() < options.length - 1 ? focused() + 1 : 0);
    }
  }));
  return box(renderer, { flexDirection: "column", marginTop: 1 }, rows);
}

export { select };
