askeroo/dist/examples/custom-ask-usage.js

A modern CLI prompt library with flow control, history navigation, and conditional prompts

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Box, Text } from "ink";
import { ask } from "../src/index.js";
// Import the plugin to register it
import "../src/built-ins/ask/index.js";
async function demonstrateCustomAsk() {
    console.log("🚀 Demonstrating Custom Ask Plugin Usage...\n");
    try {
        // Example 1: Using ask within the main ask function
        console.log("Example 1: Using ask with custom container");
        const result1 = await ask(async ({ ask }) => {
            return await ask(async ({ text, confirm }) => {
                const name = await text({ label: "What's your name?" });
                const confirmed = await confirm({
                    label: `Hello ${name}! Is this correct?`,
                });
                return { name, confirmed };
            }, {
                rootContainer: ({ children }) => (_jsxs(Box, { flexDirection: "column", borderStyle: "double", padding: 1, children: [_jsx(Text, { color: "blue", bold: true, children: "\uD83C\uDFA8 Custom Styled Container" }), _jsx(Text, { color: "gray", dimColor: true, children: "\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500" }), children, _jsx(Text, { color: "gray", dimColor: true, children: "\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500" })] })),
            });
        });
        console.log("Result 1:", result1);
        console.log("\n" + "=".repeat(50) + "\n");
        // Example 2: Using ask with different styling
        console.log("Example 2: Professional form container");
        const result2 = await ask(async ({ ask, text, multi }) => {
            return await ask(async ({ text, multi }) => {
                const name = await text({ label: "Full Name" });
                const skills = await multi({
                    label: "Select your skills:",
                    options: [
                        { value: "javascript", label: "JavaScript" },
                        { value: "typescript", label: "TypeScript" },
                        { value: "react", label: "React" },
                        { value: "node", label: "Node.js" },
                    ],
                });
                return { name, skills };
            }, {
                rootContainer: ({ children }) => (_jsxs(Box, { flexDirection: "column", margin: 1, children: [_jsx(Text, { color: "green", bold: true, children: "\uD83D\uDCCB Professional Form" }), _jsx(Box, { marginTop: 1, flexDirection: "column", children: children })] })),
                rootContainerProps: {
                    theme: "professional",
                },
            });
        });
        console.log("Result 2:", result2);
        console.log("\n" + "=".repeat(50) + "\n");
        // Example 3: Minimal container
        console.log("Example 3: Minimal indented container");
        const result3 = await ask(async ({ ask, radio }) => {
            return await ask(async ({ radio }) => {
                const choice = await radio({
                    label: "Choose an option:",
                    options: [
                        { value: "a", label: "Option A" },
                        { value: "b", label: "Option B" },
                        { value: "c", label: "Option C" },
                    ],
                });
                return { choice };
            }, {
                rootContainer: ({ children }) => (_jsx(Box, { flexDirection: "column", paddingLeft: 2, children: children })),
            });
        });
        console.log("Result 3:", result3);
        console.log("\n✅ All examples completed successfully!");
    }
    catch (error) {
        console.error("❌ Error:", error);
        process.exit(1);
    }
}
// Run the demonstration
demonstrateCustomAsk();
//# sourceMappingURL=custom-ask-usage.js.map