@vibe-kit/grok-cli
Version:
An open-source AI agent that brings the power of Grok directly into your terminal.
131 lines • 6.55 kB
JavaScript
"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importStar(require("react"));
const ink_1 = require("ink");
const diff_renderer_1 = require("./diff-renderer");
function ConfirmationDialog({ operation, filename, onConfirm, onReject, showVSCodeOpen = false, content, }) {
const [selectedOption, setSelectedOption] = (0, react_1.useState)(0);
const [feedbackMode, setFeedbackMode] = (0, react_1.useState)(false);
const [feedback, setFeedback] = (0, react_1.useState)("");
const options = [
"Yes",
"Yes, and don't ask again this session",
"No",
"No, with feedback",
];
(0, ink_1.useInput)((input, key) => {
if (feedbackMode) {
if (key.return) {
onReject(feedback.trim());
return;
}
if (key.backspace || key.delete) {
setFeedback((prev) => prev.slice(0, -1));
return;
}
if (input && !key.ctrl && !key.meta) {
setFeedback((prev) => prev + input);
}
return;
}
if (key.upArrow || (key.shift && key.tab)) {
setSelectedOption((prev) => (prev > 0 ? prev - 1 : options.length - 1));
return;
}
if (key.downArrow || key.tab) {
setSelectedOption((prev) => (prev + 1) % options.length);
return;
}
if (key.return) {
if (selectedOption === 0) {
onConfirm(false);
}
else if (selectedOption === 1) {
onConfirm(true);
}
else if (selectedOption === 2) {
onReject("Operation cancelled by user");
}
else {
setFeedbackMode(true);
}
return;
}
if (key.escape) {
if (feedbackMode) {
setFeedbackMode(false);
setFeedback("");
}
else {
// Cancel the confirmation when escape is pressed from main confirmation
onReject("Operation cancelled by user (pressed Escape)");
}
return;
}
});
if (feedbackMode) {
return (react_1.default.createElement(ink_1.Box, { flexDirection: "column", padding: 1 },
react_1.default.createElement(ink_1.Box, { flexDirection: "column", marginBottom: 1 },
react_1.default.createElement(ink_1.Text, { color: "gray" }, "Type your feedback and press Enter, or press Escape to go back.")),
react_1.default.createElement(ink_1.Box, { borderStyle: "round", borderColor: "yellow", paddingX: 1, marginTop: 1 },
react_1.default.createElement(ink_1.Text, { color: "gray" }, "\u276F "),
react_1.default.createElement(ink_1.Text, null,
feedback,
react_1.default.createElement(ink_1.Text, { color: "white" }, "\u2588")))));
}
return (react_1.default.createElement(ink_1.Box, { flexDirection: "column" },
react_1.default.createElement(ink_1.Box, { marginTop: 1 },
react_1.default.createElement(ink_1.Box, null,
react_1.default.createElement(ink_1.Text, { color: "magenta" }, "\u23FA"),
react_1.default.createElement(ink_1.Text, { color: "white" },
" ",
operation,
"(",
filename,
")"))),
react_1.default.createElement(ink_1.Box, { marginLeft: 2, flexDirection: "column" },
react_1.default.createElement(ink_1.Text, { color: "gray" }, "\u23BF Requesting user confirmation"),
showVSCodeOpen && (react_1.default.createElement(ink_1.Box, { marginTop: 1 },
react_1.default.createElement(ink_1.Text, { color: "gray" }, "\u23BF Opened changes in Visual Studio Code \u29C9"))),
content && (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(ink_1.Text, { color: "gray" },
"\u23BF ",
content.split('\n')[0]),
react_1.default.createElement(ink_1.Box, { marginLeft: 4, flexDirection: "column" },
react_1.default.createElement(diff_renderer_1.DiffRenderer, { diffContent: content, filename: filename, terminalWidth: 80 }))))),
react_1.default.createElement(ink_1.Box, { flexDirection: "column", marginTop: 1 },
react_1.default.createElement(ink_1.Box, { marginBottom: 1 },
react_1.default.createElement(ink_1.Text, null, "Do you want to proceed with this operation?")),
react_1.default.createElement(ink_1.Box, { flexDirection: "column" }, options.map((option, index) => (react_1.default.createElement(ink_1.Box, { key: index, paddingLeft: 1 },
react_1.default.createElement(ink_1.Text, { color: selectedOption === index ? "black" : "white", backgroundColor: selectedOption === index ? "cyan" : undefined },
index + 1,
". ",
option))))),
react_1.default.createElement(ink_1.Box, { marginTop: 1 },
react_1.default.createElement(ink_1.Text, { color: "gray", dimColor: true }, "\u2191\u2193 navigate \u2022 Enter select \u2022 Esc cancel")))));
}
exports.default = ConfirmationDialog;
//# sourceMappingURL=confirmation-dialog.js.map