react-use-chat
Version:
一个用于构建对话式引导流程的 React Hook,支持单选、多选和嵌套分支处理
50 lines • 2.53 kB
TypeScript
import React from 'react';
import { DialogNode, HistoryItem, SelectionBranch } from './types';
export declare const SCROLL_TO_BOTTOM_EVENT = "scrollToBottom";
/**
* @interface DialogContextType
* @description 对话上下文的状态和操作方法定义
* @property {DialogNode | null} currentNode - 当前显示的对话节点
* @property {HistoryItem[]} history - 用户的对话历史记录
* @property {string[]} learningPlan - 收集到的学习计划触发器列表
* @property {string[]} selectedAnswers - 在多选模式下,当前用户勾选的答案ID列表
* @property {SelectionBranch[][]} multiSelectBranchStack - 管理嵌套多选分支的栈,每个元素是当前层级的待处理分支数组
* @property {number[]} currentBranchIndices - 对应 multiSelectBranchStack 中每个层级当前已处理到的分支索引的栈
* @property {string[]} pendingPlanTriggers - 在对话流程结束前,临时收集的所有计划触发器
* @property {(answerId: string) => void} handleSelection - 处理单选答案选择的函数
* @property {(answerId: string) => void} handleMultiSelect - 处理多选答案勾选/取消勾选的函数
* @property {() => void} confirmSelections - 用户在多选模式下确认选择后调用的函数
* @property {() => void} resetDialog - 重置整个对话状态到初始状态的函数
*/
export interface DialogContextType {
currentNode: DialogNode | null;
history: HistoryItem[];
learningPlan: string[];
selectedAnswers: string[];
multiSelectBranchStack: SelectionBranch[][];
currentBranchIndices: number[];
pendingPlanTriggers: string[];
handleSelection: (answerId: string) => void;
handleMultiSelect: (answerId: string) => void;
confirmSelections: () => void;
resetDialog: () => void;
}
/**
* @hook useDialog
* @description 自定义 Hook,用于方便地访问对话上下文。
* @returns {DialogContextType} 对话上下文对象
*/
export declare const useDialog: () => DialogContextType;
/**
* @component DialogProvider
* @description 对话状态管理和逻辑处理的核心组件。
* 使用 React Context API 向其子组件提供对话状态和操作方法。
* @param {object} props - 组件属性
* @param {React.ReactNode} props.children - 子组件
* @param {DialogNode[]} props.dialogData - 对话节点数据
*/
export declare const DialogProvider: React.FC<{
children: React.ReactNode;
dialogData: DialogNode[];
}>;
//# sourceMappingURL=DialogContext.d.ts.map