@agent-native/toolkit 0.23.1 → 0.198.1

package/dist/app/chat/agentkit-chat/guided-questions.js

@@ -0,0 +1,658 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { sendToAgentChat } from "@agent-native/core/client/agent-chat";
+import { useAgentEngineConfigured, } from "@agent-native/core/client/agent-chat";
+import { deleteClientAppState, readClientAppState, setClientAppState, } from "@agent-native/core/client/application-state";
+import { useChangeVersions } from "@agent-native/core/client/hooks";
+import { useT } from "@agent-native/core/client/i18n";
+import { cn } from "@agent-native/toolkit/utils";
+import { IconCheck, IconChevronRight, IconUpload, IconX, } from "@tabler/icons-react";
+import { keepPreviousData, useQuery, useQueryClient, } from "@tanstack/react-query";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { BuilderSetupCard } from "../chat/run-recovery.js";
+const OTHER_OPTION_PREFIX = "__other__:";
+const EXPLORE_OPTION = {
+    label: "Explore a few options",
+    value: "__explore__",
+    description: "Show me a few distinct directions before committing.",
+};
+const DECIDE_OPTION = {
+    label: "Let the agent decide",
+    value: "__decide__",
+    description: "Use your judgment and keep moving.",
+};
+function isFileLike(value) {
+    return (typeof value === "object" &&
+        value !== null &&
+        "name" in value &&
+        typeof value.name === "string");
+}
+export function isOtherGuidedAnswer(value) {
+    return typeof value === "string" && value.startsWith(OTHER_OPTION_PREFIX);
+}
+export function getOtherGuidedAnswerText(value) {
+    return isOtherGuidedAnswer(value)
+        ? value.slice(OTHER_OPTION_PREFIX.length)
+        : "";
+}
+export function makeOtherGuidedAnswer(text = "") {
+    return `${OTHER_OPTION_PREFIX}${text}`;
+}
+export function hasGuidedAnswer(value) {
+    if (value == null || value === "")
+        return false;
+    if (Array.isArray(value))
+        return value.some(hasGuidedAnswer);
+    if (isOtherGuidedAnswer(value)) {
+        return getOtherGuidedAnswerText(value).trim().length > 0;
+    }
+    return true;
+}
+export function formatGuidedAnswerValue(value) {
+    if (Array.isArray(value)) {
+        return value.map(formatGuidedAnswerValue).filter(hasGuidedAnswer);
+    }
+    if (isOtherGuidedAnswer(value)) {
+        const text = getOtherGuidedAnswerText(value).trim();
+        return text ? `Other: ${text}` : "";
+    }
+    if (isFileLike(value))
+        return value.name;
+    return value;
+}
+export function normalizeGuidedAnswers(answers) {
+    return Object.fromEntries(Object.entries(answers).map(([id, value]) => [
+        id,
+        formatGuidedAnswerValue(value),
+    ]));
+}
+export function formatGuidedAnswersForAgent(answers, questions) {
+    const questionTextById = new Map((questions ?? [])
+        .filter((question) => question.question?.trim())
+        .map((question) => [question.id, question.question.trim()]));
+    return Object.entries(normalizeGuidedAnswers(answers))
+        .filter(([, value]) => hasGuidedAnswer(value))
+        .map(([id, value]) => {
+        const answer = Array.isArray(value) ? value.join(", ") : String(value);
+        const question = questionTextById.get(id);
+        return question ? `Q: ${question}\nA: ${answer}` : `${id}: ${answer}`;
+    })
+        .join("\n");
+}
+const SETTLED_ANSWERS_INSTRUCTION = "Treat every question below as settled: do not ask it again, and do not ask for a confirmation of it. Continue the work these answers were blocking.";
+function defaultGuidedSubmitContext(formattedAnswers) {
+    return [
+        "The user answered the guided questions.",
+        "Use the selected option values below as authoritative. If an answer includes exact ids, file names, or action instructions, follow those exact details instead of inferring them.",
+        "",
+        "Answers:",
+        formattedAnswers,
+    ].join("\n");
+}
+function settledGuidedSubmitContext(context) {
+    return [context, SETTLED_ANSWERS_INSTRUCTION].filter(Boolean).join("\n\n");
+}
+const GUIDED_QUESTIONS_STATE_KEY = "guided-questions";
+const clientQuestionResolvers = new Map();
+let askQuestionCounter = 0;
+function nextClientResolveId() {
+    askQuestionCounter += 1;
+    const rand = typeof crypto !== "undefined" && typeof crypto.randomUUID === "function"
+        ? crypto.randomUUID()
+        : `${Date.now()}-${Math.random().toString(36).slice(2)}`;
+    return `askq-${askQuestionCounter}-${rand}`;
+}
+function resolveClientQuestion(id, answer) {
+    const resolver = clientQuestionResolvers.get(id);
+    if (!resolver)
+        return false;
+    clientQuestionResolvers.delete(id);
+    resolver(answer);
+    return true;
+}
+function extractSingleAnswer(answers, questionId) {
+    const raw = answers[questionId];
+    if (!hasGuidedAnswer(raw))
+        return null;
+    if (Array.isArray(raw)) {
+        const values = raw
+            .map((v) => isOtherGuidedAnswer(v) ? getOtherGuidedAnswerText(v).trim() : String(v))
+            .filter((s) => s.length > 0);
+        return values.length ? values : null;
+    }
+    if (isOtherGuidedAnswer(raw)) {
+        const text = getOtherGuidedAnswerText(raw).trim();
+        return text.length ? text : null;
+    }
+    return String(raw);
+}
+export async function askUserQuestion(input) {
+    const question = String(input?.question ?? "").trim();
+    if (!question) {
+        throw new TypeError("askUserQuestion: `question` is required.");
+    }
+    const header = typeof input.header === "string" && input.header.trim()
+        ? input.header.trim()
+        : undefined;
+    const allowMultiple = input.allowMultiple === true;
+    const allowFreeText = input.allowFreeText !== false;
+    const options = (Array.isArray(input.options) ? input.options : [])
+        .map((raw) => {
+        const label = typeof raw?.label === "string" && raw.label.trim()
+            ? raw.label.trim()
+            : typeof raw?.value === "string"
+                ? String(raw.value).trim()
+                : "";
+        if (!label)
+            return null;
+        const value = typeof raw?.value === "string" && raw.value.trim()
+            ? raw.value.trim()
+            : label;
+        const option = { label, value };
+        if (typeof raw.description === "string" && raw.description.trim()) {
+            option.description = raw.description.trim();
+        }
+        if (typeof raw.preview === "string" && raw.preview.trim()) {
+            option.preview = raw.preview;
+        }
+        if (raw.recommended === true)
+            option.recommended = true;
+        return option;
+    })
+        .filter((opt) => opt !== null);
+    if (options.length === 0) {
+        throw new TypeError("askUserQuestion: `options` must contain at least one option with a label.");
+    }
+    const resolveId = nextClientResolveId();
+    const payload = {
+        clientResolveId: resolveId,
+        questions: [
+            {
+                id: "q1",
+                type: "text-options",
+                question,
+                ...(header ? { header } : {}),
+                required: !allowFreeText,
+                multiSelect: allowMultiple,
+                allowOther: allowFreeText,
+                includeExplore: false,
+                includeDecide: false,
+                options,
+            },
+        ],
+    };
+    const answerPromise = new Promise((resolve) => {
+        clientQuestionResolvers.set(resolveId, resolve);
+    });
+    if (typeof window !== "undefined") {
+        try {
+            window.dispatchEvent(new CustomEvent("agent-panel:open"));
+        }
+        catch {
+            // best-effort — the question still renders if the panel is already open
+        }
+    }
+    try {
+        await setClientAppState(input.stateKey ?? GUIDED_QUESTIONS_STATE_KEY, payload);
+    }
+    catch (err) {
+        clientQuestionResolvers.delete(resolveId);
+        throw err;
+    }
+    return answerPromise;
+}
+function optionKey(option) {
+    return `${option.value.toLowerCase()}::${option.label.toLowerCase()}`;
+}
+function recommendedFirst(options) {
+    if (!options.some((option) => option.recommended))
+        return [...options];
+    return [
+        ...options.filter((option) => option.recommended),
+        ...options.filter((option) => !option.recommended),
+    ];
+}
+function defaultGuidedAnswers(questions) {
+    const answers = {};
+    for (const question of questions) {
+        if (question.type !== "text-options" && question.type !== "color-options")
+            continue;
+        const recommended = (question.options ?? question.choices ?? [])
+            .filter((option) => option.recommended)
+            .map((option) => option.value);
+        const first = recommended[0];
+        if (!first)
+            continue;
+        answers[question.id] = question.multiSelect ? recommended : first;
+    }
+    return answers;
+}
+export function guidedQuestionsFingerprint(questions) {
+    return JSON.stringify(questions.map((question) => ({
+        id: question.id,
+        type: question.type,
+        header: question.header ?? null,
+        question: question.question,
+        description: question.description ?? null,
+        multiSelect: question.multiSelect ?? false,
+        required: question.required ?? false,
+        allowOther: question.allowOther ?? null,
+        includeExplore: question.includeExplore ?? null,
+        includeDecide: question.includeDecide ?? null,
+        submitOnSelect: question.submitOnSelect ?? false,
+        min: question.min ?? null,
+        max: question.max ?? null,
+        step: question.step ?? null,
+        placeholder: question.placeholder ?? null,
+        options: (question.options ?? question.choices ?? []).map((option) => ({
+            label: option.label,
+            value: option.value,
+            color: option.color ?? null,
+            description: option.description ?? null,
+            recommended: option.recommended ?? false,
+        })),
+    })));
+}
+function withDefaultOptions(question) {
+    const base = recommendedFirst(question.options ?? question.choices ?? []);
+    const seen = new Set(base.map(optionKey));
+    const result = [...base];
+    const maybePush = (option, enabled) => {
+        if (!enabled)
+            return;
+        const key = optionKey(option);
+        const label = option.label.toLowerCase();
+        const value = option.value.toLowerCase();
+        const duplicate = result.some((existing) => optionKey(existing) === key ||
+            existing.label.toLowerCase() === label ||
+            existing.value.toLowerCase() === value);
+        if (duplicate || seen.has(key))
+            return;
+        seen.add(key);
+        result.push(option);
+    };
+    maybePush(EXPLORE_OPTION, question.includeExplore !== false);
+    maybePush(DECIDE_OPTION, question.includeDecide !== false);
+    return result;
+}
+export function GuidedQuestionProviderGate({ providerStatus, onRetry, }) {
+    const t = useT();
+    if (providerStatus === "unknown" || providerStatus === "configured") {
+        return null;
+    }
+    if (providerStatus === "missing") {
+        return (_jsx(BuilderSetupCard, { fullWidth: true, onConnected: onRetry, onRetry: onRetry }));
+    }
+    return (_jsxs("div", { className: "flex items-center justify-between gap-3 rounded-md border border-border bg-muted/50 px-3 py-2 text-sm text-muted-foreground", role: "status", children: [_jsx("span", { children: t("agentChat.setup.providerStatusUnavailable") }), _jsx("button", { type: "button", className: "shrink-0 font-medium text-foreground underline-offset-4 hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", onClick: onRetry, children: t("agentChat.common.retry") })] }));
+}
+export function GuidedQuestionFlow({ questions, onSubmit, onSkip, title = "Before I generate", description = "Use Other for custom details, or let the agent decide.", skipLabel = "Skip", submitLabel = "Continue", isSubmitting = false, isSubmissionBlocked = false, providerStatus = "configured", onRetryProviderStatus, showProviderStatusGate = true, className, }) {
+    const [answers, setAnswers] = useState(() => defaultGuidedAnswers(questions));
+    const questionsFingerprint = useMemo(() => guidedQuestionsFingerprint(questions), [questions]);
+    useEffect(() => {
+        setAnswers(defaultGuidedAnswers(questions));
+        // The fingerprint owns reset identity so polling does not erase answers.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [questionsFingerprint]);
+    const setAnswer = useCallback((id, value) => {
+        setAnswers((prev) => ({ ...prev, [id]: value }));
+    }, []);
+    const submitAnswers = useCallback((nextAnswers = answers) => {
+        if (isSubmissionBlocked || isSubmitting)
+            return;
+        onSubmit(normalizeGuidedAnswers(nextAnswers));
+    }, [answers, isSubmissionBlocked, isSubmitting, onSubmit]);
+    const submissionsDisabled = isSubmitting || isSubmissionBlocked;
+    const inputsDisabled = isSubmitting || (isSubmissionBlocked && providerStatus !== "unknown");
+    const allRequiredAnswered = questions
+        .filter((question) => question.required)
+        .every((question) => hasGuidedAnswer(answers[question.id]));
+    return (_jsx("div", { className: cn("guided-question-flow flex h-full w-full items-center justify-center bg-background text-foreground", className), children: _jsxs("div", { className: "guided-question-flow-inner flex max-h-full w-full max-w-3xl flex-col px-3 py-4", children: [_jsxs("div", { className: "guided-question-flow-header mb-4 min-w-0", children: [_jsx("h2", { className: "guided-question-flow-title text-lg font-semibold leading-tight tracking-normal text-foreground", children: title }), description && (_jsx("p", { className: "guided-question-flow-description mt-1 max-w-2xl text-sm leading-5 text-muted-foreground", children: description }))] }), _jsx("fieldset", { disabled: inputsDisabled, className: "guided-question-flow-list m-0 min-h-0 min-w-0 flex-1 overflow-y-auto border-0 p-0 pe-1", children: questions.map((question, index) => (_jsx(QuestionCard, { index: index, question: question, value: answers[question.id], disabled: inputsDisabled, onChange: (value) => setAnswer(question.id, value), onSubmitAnswer: (value) => submitAnswers({ ...answers, [question.id]: value }) }, question.id))) }), isSubmissionBlocked && showProviderStatusGate ? (_jsx("div", { className: "guided-question-provider-gate mt-3", children: _jsx(GuidedQuestionProviderGate, { providerStatus: providerStatus, onRetry: onRetryProviderStatus }) })) : null, _jsxs("div", { className: "guided-question-flow-footer mt-4 flex shrink-0 items-center justify-between gap-3 border-t border-border pt-3", children: [_jsx("div", { className: "flex items-center gap-1.5", children: questions.map((question, index) => (_jsx("span", { className: cn("h-1.5 w-1.5 rounded-full", hasGuidedAnswer(answers[question.id])
+                                    ? "bg-primary"
+                                    : "bg-muted-foreground/30") }, question.id || index))) }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("button", { type: "button", onClick: onSkip, disabled: submissionsDisabled, className: "cursor-pointer rounded-md px-3 py-2 text-sm text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground", children: skipLabel }), _jsxs("button", { type: "button", onClick: () => submitAnswers(), disabled: !allRequiredAnswered || submissionsDisabled, className: "inline-flex cursor-pointer items-center gap-2 rounded-md bg-primary px-3.5 py-2 text-sm font-medium text-primary-foreground transition-colors hover:bg-primary/90 disabled:cursor-not-allowed disabled:opacity-45", children: [submitLabel, _jsx(IconChevronRight, { className: "h-4 w-4 rtl:-scale-x-100" })] })] })] })] }) }));
+}
+function QuestionCard({ index, question, value, disabled, onChange, onSubmitAnswer, }) {
+    return (_jsxs("section", { className: "guided-question-card border-t border-border/60 py-3 first:border-t-0 first:pt-0 last:pb-0", children: [_jsxs("div", { className: "mb-2 flex gap-2.5", children: [_jsx("div", { className: "guided-question-index mt-0.5 min-w-4 text-xs font-medium tabular-nums text-muted-foreground", children: index + 1 }), _jsxs("div", { className: "min-w-0", children: [question.header && (_jsx("p", { className: "mb-1 text-[11px] font-medium uppercase text-muted-foreground", children: question.header })), _jsxs("h3", { className: "text-sm font-medium leading-5 text-foreground", children: [question.question, question.required && (_jsx("span", { className: "ms-1 text-destructive", children: "*" }))] }), question.description && (_jsx("p", { className: "mt-1 text-xs leading-5 text-muted-foreground", children: question.description }))] })] }), question.type === "text-options" && (_jsx(TextOptions, { question: question, value: value, onChange: onChange, onSubmitAnswer: onSubmitAnswer })), question.type === "color-options" && (_jsx(ColorOptions, { question: question, value: value, onChange: onChange })), question.type === "slider" && (_jsx(SliderQuestion, { question: question, value: value, onChange: onChange })), question.type === "file" && (_jsx(FileDropZone, { value: value, disabled: disabled, onChange: onChange })), question.type === "freeform" && (_jsx("textarea", { value: typeof value === "string" ? value : "", onChange: (event) => onChange(event.target.value), placeholder: question.placeholder ?? "Type your answer...", className: "min-h-[84px] w-full resize-none rounded-md border border-border bg-muted/45 px-3 py-2 text-sm text-foreground outline-none placeholder:text-muted-foreground/70 focus:border-primary" }))] }));
+}
+function TextOptions({ question, value, onChange, onSubmitAnswer, }) {
+    const options = useMemo(() => withDefaultOptions(question), [question]);
+    const multiSelect = question.multiSelect === true;
+    const selectedValues = Array.isArray(value) ? value : [];
+    const otherSelected = multiSelect
+        ? selectedValues.some(isOtherGuidedAnswer)
+        : isOtherGuidedAnswer(value);
+    const otherText = multiSelect
+        ? getOtherGuidedAnswerText(selectedValues.find(isOtherGuidedAnswer))
+        : getOtherGuidedAnswerText(value);
+    const isSelected = (optionValue) => multiSelect ? selectedValues.includes(optionValue) : value === optionValue;
+    const toggleOption = (optionValue) => {
+        if (!multiSelect) {
+            onChange(optionValue);
+            if (question.submitOnSelect)
+                onSubmitAnswer(optionValue);
+            return;
+        }
+        const next = selectedValues.includes(optionValue)
+            ? selectedValues.filter((item) => item !== optionValue)
+            : [...selectedValues, optionValue];
+        onChange(next);
+    };
+    const toggleOther = () => {
+        if (!multiSelect) {
+            onChange(otherSelected ? "" : makeOtherGuidedAnswer());
+            return;
+        }
+        if (otherSelected) {
+            onChange(selectedValues.filter((item) => !isOtherGuidedAnswer(item)));
+            return;
+        }
+        onChange([...selectedValues, makeOtherGuidedAnswer()]);
+    };
+    const setOtherText = (text) => {
+        const nextOther = makeOtherGuidedAnswer(text);
+        if (!multiSelect) {
+            onChange(nextOther);
+            return;
+        }
+        onChange([
+            ...selectedValues.filter((item) => !isOtherGuidedAnswer(item)),
+            nextOther,
+        ]);
+    };
+    const allowOther = question.allowOther !== false;
+    return (_jsxs("div", { className: "space-y-2.5", children: [_jsxs("div", { className: "guided-question-flow-options grid grid-cols-1 gap-2", children: [options.map((option) => (_jsx(OptionButton, { option: option, selected: isSelected(option.value), multiSelect: multiSelect, onClick: () => toggleOption(option.value) }, `${option.value}:${option.label}`))), allowOther && (_jsx(OptionButton, { option: {
+                            label: "Other...",
+                            value: "__other__",
+                            description: "Tell the agent exactly what you mean.",
+                        }, selected: otherSelected, multiSelect: multiSelect, onClick: toggleOther }))] }), allowOther && otherSelected && (_jsx("textarea", { autoFocus: true, value: otherText, onChange: (event) => setOtherText(event.target.value), placeholder: question.placeholder ?? "Type a custom answer...", className: "min-h-[72px] w-full resize-none rounded-md border border-border bg-muted/45 px-3 py-2 text-sm text-foreground outline-none placeholder:text-muted-foreground/70 focus:border-primary" }))] }));
+}
+function OptionButton({ option, selected, multiSelect, onClick, }) {
+    return (_jsxs("button", { type: "button", onClick: onClick, "aria-pressed": selected, className: cn("group flex min-h-11 min-w-0 cursor-pointer items-start gap-2 rounded-md border px-2.5 py-2 text-start transition-colors", selected
+            ? "border-primary bg-primary/10 text-foreground ring-2 ring-primary/25"
+            : "border-border bg-muted/30 text-muted-foreground hover:border-muted-foreground/50 hover:bg-muted/45 hover:text-foreground"), children: [_jsx("span", { className: cn("mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center border", multiSelect ? "rounded-sm" : "rounded-full", selected
+                    ? "border-primary bg-primary text-primary-foreground"
+                    : "border-border bg-background"), "aria-hidden": true, children: selected && _jsx(IconCheck, { className: "h-3 w-3" }) }), _jsxs("span", { className: "min-w-0 flex-1", children: [_jsxs("span", { className: "flex flex-wrap items-center gap-1.5 text-sm font-medium leading-5", children: [option.label, option.recommended && (_jsx("span", { className: "rounded-sm bg-primary/15 px-1.5 py-0.5 text-[10px] font-medium uppercase text-primary", children: "Recommended" }))] }), option.description && (_jsx("span", { className: "mt-0.5 block text-xs leading-4 text-muted-foreground", children: option.description })), option.preview && (_jsx("span", { className: "mt-1.5 block max-h-40 overflow-auto whitespace-pre-wrap rounded border border-border/60 bg-background/60 px-2 py-1.5 font-mono text-[11px] leading-4 text-muted-foreground", children: option.preview }))] })] }));
+}
+function ColorOptions({ question, value, onChange, }) {
+    const options = useMemo(() => recommendedFirst(question.options ?? question.choices ?? []), [question]);
+    const multiSelect = question.multiSelect === true;
+    const selectedValues = Array.isArray(value) ? value : [];
+    const isSelected = (optionValue) => multiSelect ? selectedValues.includes(optionValue) : value === optionValue;
+    const toggleOption = (optionValue) => {
+        if (!multiSelect) {
+            onChange(optionValue);
+            return;
+        }
+        onChange(selectedValues.includes(optionValue)
+            ? selectedValues.filter((item) => item !== optionValue)
+            : [...selectedValues, optionValue]);
+    };
+    return (_jsx("div", { className: "flex flex-wrap gap-3", children: options.map((option) => {
+            const selected = isSelected(option.value);
+            return (_jsxs("button", { type: "button", onClick: () => toggleOption(option.value), className: "group flex cursor-pointer flex-col items-center gap-1.5", children: [_jsx("span", { className: cn("h-10 w-10 rounded-full", selected
+                            ? "ring-2 ring-primary ring-offset-2 ring-offset-background"
+                            : "ring-1 ring-border group-hover:ring-muted-foreground/50"), style: { backgroundColor: option.color || option.value } }), _jsx("span", { className: cn("max-w-20 truncate text-[10px]", selected ? "text-foreground" : "text-muted-foreground"), children: option.label })] }, `${option.value}:${option.label}`));
+        }) }));
+}
+function SliderQuestion({ question, value, onChange, }) {
+    const min = question.min ?? 0;
+    const max = question.max ?? 100;
+    const step = question.step ?? 1;
+    const current = typeof value === "number" ? value : Math.round((min + max) / 2);
+    return (_jsxs("div", { className: "flex items-center gap-4", children: [_jsx("span", { className: "w-8 text-xs text-muted-foreground", children: min }), _jsx("input", { type: "range", min: min, max: max, step: step, value: current, onChange: (event) => onChange(Number(event.target.value)), className: "h-2 flex-1 cursor-pointer accent-primary" }), _jsx("span", { className: "w-8 text-end text-xs text-muted-foreground", children: max }), _jsx("span", { className: "min-w-10 text-end text-sm font-medium tabular-nums text-foreground", children: current })] }));
+}
+function FileDropZone({ value, disabled, onChange, }) {
+    const [dragOver, setDragOver] = useState(false);
+    const files = Array.isArray(value) ? value : [];
+    const addFiles = (incoming) => {
+        if (!disabled)
+            onChange([...files, ...incoming]);
+    };
+    const removeFile = (index) => onChange(files.filter((_, fileIndex) => fileIndex !== index));
+    return (_jsxs("div", { children: [_jsxs("div", { onDragOver: (event) => {
+                    if (disabled) {
+                        event.preventDefault();
+                        return;
+                    }
+                    event.preventDefault();
+                    setDragOver(true);
+                }, onDragLeave: () => setDragOver(false), onDrop: (event) => {
+                    if (disabled) {
+                        event.preventDefault();
+                        return;
+                    }
+                    event.preventDefault();
+                    setDragOver(false);
+                    addFiles(Array.from(event.dataTransfer.files));
+                }, className: cn("flex cursor-pointer flex-col items-center justify-center rounded-md border-2 border-dashed p-5 transition-colors", dragOver
+                    ? "border-primary bg-primary/5"
+                    : "border-border bg-muted/30 hover:border-muted-foreground/50"), children: [_jsx(IconUpload, { className: "mb-2 h-5 w-5 text-muted-foreground" }), _jsxs("p", { className: "text-sm text-muted-foreground", children: ["Drag files here or", " ", _jsxs("label", { className: "cursor-pointer text-primary hover:underline", children: ["browse", _jsx("input", { type: "file", multiple: true, disabled: disabled, onChange: (event) => {
+                                            if (event.target.files)
+                                                addFiles(Array.from(event.target.files));
+                                            event.currentTarget.value = "";
+                                        }, className: "hidden" })] })] })] }), files.length > 0 && (_jsx("div", { className: "mt-2 space-y-1", children: files.map((file, index) => (_jsxs("div", { className: "flex items-center gap-2 rounded-md bg-muted/50 px-2 py-1 text-xs text-muted-foreground", children: [_jsx(IconCheck, { className: "h-3 w-3 text-primary" }), _jsx("span", { className: "min-w-0 flex-1 truncate", children: file.name }), _jsx("button", { type: "button", onClick: () => removeFile(index), disabled: disabled, className: "cursor-pointer text-muted-foreground/70 hover:text-foreground", "aria-label": `Remove ${file.name}`, children: _jsx(IconX, { className: "h-3 w-3" }) })] }, `${file.name}:${index}`))) }))] }));
+}
+const SAFE_BROWSER_TAB_ID_RE = /^[A-Za-z0-9_-]{1,96}$/;
+function normalizeBrowserTabId(browserTabId) {
+    if (typeof browserTabId !== "string")
+        return undefined;
+    const trimmed = browserTabId.trim();
+    return SAFE_BROWSER_TAB_ID_RE.test(trimmed) ? trimmed : undefined;
+}
+function payloadBelongsToThread(payload, threadId) {
+    const asker = typeof payload.threadId === "string" ? payload.threadId.trim() : "";
+    if (!asker)
+        return true;
+    return asker === (threadId ?? "").trim();
+}
+export function useGuidedQuestionFlow({ enabled = true, stateKey = "show-questions", browserTabId, threadId, providerStatusChecksEnabled = true, providerStatus: providedProviderStatus, queryKey = ["show-questions"], refetchInterval = false, submitMessage = "Here are my answers — go ahead.", skipMessage = "Skip the questions — let the agent decide.", buildSubmitContext, buildSkipContext, onSubmitMessage, onSkipMessage, } = {}) {
+    const queryClient = useQueryClient();
+    const [payload, setPayload] = useState(null);
+    const normalizedBrowserTabId = useMemo(() => normalizeBrowserTabId(browserTabId), [browserTabId]);
+    const scopedKey = normalizedBrowserTabId
+        ? `${stateKey}:${normalizedBrowserTabId}`
+        : stateKey;
+    const stateVersionSources = useMemo(() => normalizedBrowserTabId
+        ? [`app-state:${scopedKey}`, `app-state:${stateKey}`]
+        : [`app-state:${stateKey}`], [normalizedBrowserTabId, scopedKey, stateKey]);
+    const stateVersion = useChangeVersions(stateVersionSources);
+    const resolvedQueryKey = useMemo(() => [...queryKey, normalizedBrowserTabId ?? "global", stateVersion], [queryKey, normalizedBrowserTabId, stateVersion]);
+    const resolvedRefetchInterval = refetchInterval === false
+        ? false
+        : (query) => {
+            const activeQuestions = query.state.data?.questions;
+            if (Array.isArray(activeQuestions) && activeQuestions.length > 0) {
+                return false;
+            }
+            return refetchInterval;
+        };
+    const { data, refetch } = useQuery({
+        queryKey: resolvedQueryKey,
+        enabled,
+        queryFn: async () => {
+            const read = async (key) => {
+                const parsed = await readClientAppState(key).catch(() => null);
+                if (Array.isArray(parsed?.questions) && parsed.questions.length > 0) {
+                    return parsed;
+                }
+                return null;
+            };
+            return ((normalizedBrowserTabId ? await read(scopedKey) : null) ??
+                (await read(stateKey)));
+        },
+        refetchInterval: resolvedRefetchInterval,
+        structuralSharing: false,
+        placeholderData: keepPreviousData,
+    });
+    useEffect(() => {
+        if (Array.isArray(data?.questions) && data.questions.length > 0) {
+            setPayload((prev) => {
+                if (prev &&
+                    guidedQuestionsFingerprint(prev.questions) ===
+                        guidedQuestionsFingerprint(data.questions) &&
+                    prev.clientResolveId === data.clientResolveId &&
+                    prev.threadId === data.threadId) {
+                    return prev;
+                }
+                return data;
+            });
+        }
+        else {
+            setPayload(null);
+        }
+    }, [data]);
+    const visiblePayload = payload && payloadBelongsToThread(payload, threadId) ? payload : null;
+    const needsAgentProvider = Boolean(visiblePayload?.questions.length && !visiblePayload.clientResolveId);
+    const queriedProviderStatus = useAgentEngineConfigured(enabled &&
+        needsAgentProvider &&
+        providerStatusChecksEnabled &&
+        providedProviderStatus === undefined, { tabId: browserTabId, threadId });
+    const providerStatus = providerStatusChecksEnabled
+        ? (providedProviderStatus ?? queriedProviderStatus.state)
+        : "configured";
+    const isSubmissionBlocked = enabled &&
+        needsAgentProvider &&
+        providerStatusChecksEnabled &&
+        providerStatus !== "configured";
+    const retryProviderStatus = useCallback(() => {
+        if (typeof window !== "undefined") {
+            window.dispatchEvent(new Event("agent-engine:configured-changed"));
+        }
+    }, []);
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    const submissionInFlightRef = useRef(false);
+    const clear = useCallback(() => {
+        setPayload(null);
+        queryClient.setQueryData(resolvedQueryKey, null);
+        const del = (key) => deleteClientAppState(key).catch(() => { });
+        void del(scopedKey);
+        if (scopedKey !== stateKey)
+            void del(stateKey);
+    }, [queryClient, resolvedQueryKey, scopedKey, stateKey]);
+    const sendAndClearOnDelivery = useCallback((send) => {
+        if (submissionInFlightRef.current)
+            return;
+        const result = send();
+        if (!result) {
+            clear();
+            return;
+        }
+        submissionInFlightRef.current = true;
+        setIsSubmitting(true);
+        void result
+            .then(({ delivered }) => {
+            if (delivered)
+                clear();
+        })
+            .catch((error) => {
+            console.error("Guided question submission failed", error);
+        })
+            .finally(() => {
+            submissionInFlightRef.current = false;
+            setIsSubmitting(false);
+        });
+    }, [clear]);
+    const handleSubmit = useCallback((answers) => {
+        if (submissionInFlightRef.current)
+            return;
+        const resolveId = visiblePayload?.clientResolveId;
+        if (resolveId) {
+            const firstId = visiblePayload?.questions?.[0]?.id ?? "q1";
+            resolveClientQuestion(resolveId, extractSingleAnswer(answers, firstId));
+            clear();
+            return;
+        }
+        if (isSubmissionBlocked)
+            return;
+        const formattedAnswers = formatGuidedAnswersForAgent(answers, visiblePayload?.questions);
+        const resolvedSubmitMessage = visiblePayload?.submitMessage ?? submitMessage;
+        const context = [
+            settledGuidedSubmitContext(buildSubmitContext?.({ answers, formattedAnswers }) ??
+                defaultGuidedSubmitContext(formattedAnswers)),
+            visiblePayload?.submitContext,
+        ]
+            .filter(Boolean)
+            .join("\n\n");
+        if (onSubmitMessage) {
+            sendAndClearOnDelivery(() => onSubmitMessage({
+                answers,
+                formattedAnswers,
+                message: resolvedSubmitMessage,
+                context,
+            }));
+        }
+        else {
+            sendToAgentChat({
+                message: resolvedSubmitMessage,
+                context,
+                submit: true,
+            });
+            clear();
+        }
+    }, [
+        buildSubmitContext,
+        clear,
+        onSubmitMessage,
+        sendAndClearOnDelivery,
+        isSubmissionBlocked,
+        visiblePayload,
+        submitMessage,
+    ]);
+    const handleSkip = useCallback(() => {
+        if (submissionInFlightRef.current)
+            return;
+        const resolveId = visiblePayload?.clientResolveId;
+        if (resolveId) {
+            resolveClientQuestion(resolveId, null);
+            clear();
+            return;
+        }
+        if (isSubmissionBlocked)
+            return;
+        const message = visiblePayload?.skipMessage ?? skipMessage;
+        const context = [buildSkipContext?.(), visiblePayload?.submitContext]
+            .filter(Boolean)
+            .join("\n\n");
+        if (onSkipMessage) {
+            sendAndClearOnDelivery(() => onSkipMessage({ message, context }));
+        }
+        else {
+            sendToAgentChat({ message, context, submit: true });
+            clear();
+        }
+    }, [
+        buildSkipContext,
+        clear,
+        onSkipMessage,
+        sendAndClearOnDelivery,
+        isSubmissionBlocked,
+        visiblePayload,
+        skipMessage,
+    ]);
+    const refetchPendingQuestion = useCallback(async () => {
+        const result = await refetch();
+        if (result.status === "error") {
+            return true;
+        }
+        const latest = result.data ?? null;
+        return Boolean(latest &&
+            payloadBelongsToThread(latest, threadId) &&
+            Array.isArray(latest.questions) &&
+            latest.questions.length > 0);
+    }, [refetch, threadId]);
+    return {
+        payload: visiblePayload,
+        questions: visiblePayload?.questions ?? null,
+        title: visiblePayload?.title,
+        description: visiblePayload?.description,
+        skipLabel: visiblePayload?.skipLabel,
+        submitLabel: visiblePayload?.submitLabel,
+        isSubmitting,
+        isSubmissionBlocked,
+        providerStatus,
+        retryProviderStatus,
+        clear,
+        handleSubmit,
+        handleSkip,
+        refetchPendingQuestion,
+    };
+}
+//# sourceMappingURL=guided-questions.js.map