@assistant-ui/react-devtools

反应 DevTools 用户界面 @assistant-ui/react在任何主机应用程序中嵌入事件日志、上下文查看器和运行时间检查器.

安装

npm install @assistant-ui/react-devtools

使用量

丢弃 DevToolsModal 在你体内 AssistantRuntimeProvider它使起浮发射器和内置面板(被同化为阴影根)成为生产建筑中的禁用物.

import { AssistantRuntimeProvider } from "@assistant-ui/react";
import { DevToolsModal } from "@assistant-ui/react-devtools";

export function App() {
  return (
    <AssistantRuntimeProvider runtime={runtime}>
      <DevToolsModal />
      {/* ...your assistant-ui... */}
    </AssistantRuntimeProvider>
  );
}

自定义标签

通过插件注册可扩展面板 。 每个插件都接收被检查实例的预测数据并制作一个标签正文.

import { createDevToolsPlugin, DevToolsModal } from "@assistant-ui/react-devtools";

const myTab = createDevToolsPlugin({
  id: "my-tab",
  label: "My tab",
  Component: ({ data }) => <pre>{JSON.stringify(data.state, null, 2)}</pre>,
});

<DevToolsModal plugins={[myTab]} />;

文档

详细参考资料 助理-ui.com/docs/演示文稿。 。 。 .