新版 CopilotKit 1.0 引入了一个时尚的生成式 UI 功能,允许您在聊天界面中渲染完全自定义的 React 组件。这种强大的功能使您能够将 AI 驱动的功能无缝集成到应用程序的用户体验中。

借助生成式 UI,您可以创建视觉上吸引人且交互式的组件,超越简单的基于文本的交互。例如,在演示中展示的内容中,CopilotKit 被用来生成类似电子表格的预览组件,允许用户快速可视化和交互数据,而无需手动创建 UI。

生成式 UI 建立在 CopilotKit 的基于 GraphQL 的协议之上,提供了一种灵活高效的方式来处理输入和输出字段。这种集成确保生成的组件可以实时与 CopilotKit 运行时进行通信,实现动态更新和响应式交互。

开发人员可以利用新的 React SDK 钩子,如 useCopilotAction 钩子,直接与应用程序中的 CopilotKit 进行交互。这允许应用程序的状态和 AI 驱动的功能之间实现紧密集成,创造出无缝的用户体验。

此外,useCopilotReadable 钩子优化了应用程序状态的通信,确保前端和 CopilotKit 运行时之间的高效数据传输。这一特性有助于维持高性能和响应性,即使在复杂的数据驱动应用程序中也是如此。

总的来说,CopilotKit 1.0 版本的时尚生成式 UI 代表了将 AI 驱动的助手集成到产品体验中的重大进步。开发人员现在可以创建视觉上吸引人且交互式的组件,利用 CopilotKit 的强大功能,提升整体用户体验并推动应用程序的创新。

CopilotKit 的最新版本 1.0 引入了一个重大改进,那就是集成了基于 GraphQL 的协议。这个新功能使开发人员能够利用 GraphQL 在 CopilotKit 运行时和他们的应用程序之间实现无缝通信。

GraphQL 集成的主要亮点包括:

1. GraphQL API: 新的 CopilotKit 运行时使用 GraphQL API,使开发人员能够利用 GraphQL 的灵活性和效率来满足应用程序的数据需求。

2. 输入和输出字段: GraphQL API 支持输入和输出字段,这对于构建需要动态数据交换的实时应用程序至关重要。

3. 流式数据: 开发人员现在可以使用 GraphQL API 独立流式传输数据,允许在应用程序内进行高效和响应式的数据更新。

CopilotKit 中这些新的基于 GraphQL 的协议赋能开发人员以更大的便利性和灵活性将 AI 驱动的 copilot 集成到他们的产品中。通过利用 GraphQL 的优势,开发人员可以优化应用程序状态的通信,并提升其 AI 驱动应用程序的整体用户体验。

CopilotKit 提供了一组强大的 React SDK 钩子,使您能够无缝地将 AI 功能集成到应用程序中。这些钩子使您的应用程序与 CopilotKit 运行时之间实现直接交互,轻松利用该平台的全部潜力。

CopilotKit 提供的主要钩子包括:

1. useCopilotReadable: 此钩子允许您向 CopilotKit 引擎提供前端上下文,使 AI 助手能够理解您应用程序的当前状态。您可以传递数据结构,如当前电子表格数据,并将其与特定标签关联,以便 CopilotKit 理解。

2. useCopilotAction: 此钩子使 CopilotKit 能够在您的应用程序中执行操作。您可以定义操作,如建议电子表格覆盖,并传入必要的参数。该钩子提供了渲染函数和处理函数,允许您自定义 UI 和操作行为。

3. useCopilotChatSuggestion: 此钩子根据您应用程序的当前状态生成聊天建议,使 AI 助手能够向用户提供上下文相关的建议。

这些钩子设计得很直观易用,在整个代码库中都有完整的类型传播。这确保了无缝的集成体验,并帮助您在无需大量样板或复杂设置的情况下利用 CopilotKit 的强大功能。

通过利用这些强大的 React SDK 钩子,您可以快速高效地将 AI 功能集成到应用程序中,提升用户体验并为您的产品开辟新的可能性。

CopilotReadable 钩子是 Copilot Kit 框架提供的一个强大工具,它允许您优化应用程序与 Copilot 引擎之间的通信。该钩子使您能够无缝地将信息从前端传递到 Copilot 引擎,确保 AI 助手拥有必要的上下文来提供准确和相关的响应。

使用 CopilotReadable 钩子,您可以定义要与 Copilot 引擎共享的数据,例如应用程序的当前状态或 AI 助手可能需要提供有用建议或操作的任何相关信息。通过提供此上下文,您可以确保 Copilot 的响应针对您的应用程序和用户的特定需求进行定制。

CopilotReadable 钩子非常灵活,允许您以各种格式(包括 JSON 模式)传递数据。这确保了类型在整个代码库中完全传播,使您更容易使用 Copilot 集成,并降低错误风险。

总的来说,CopilotReadable 钩子是 Copilot Kit 框架的关键组件,它使您能够优化应用程序与 AI 助手之间的通信,从而实现 Copilot 功能在您的产品中的更加无缝和有效的集成。

useCopilotChat 钩子是 Copilot Kit 1.0 版本引入的一个强大功能。该钩子允许您根据当前的应用程序状态生成智能聊天建议,使您的用户能够快速轻松地与您的 AI 驱动应用程序进行交互。

以下是如何利用 useCopilotChat 钩子:

1. 导入钩子: 首先从 Copilot Kit 库中导入 useCopilotChat 钩子。

import { useCopilotChat } from '@copilot-kit/react';

2. 在组件中使用钩子: 在您的组件中调用 useCopilotChat 钩子,并传入任何相关的应用程序状态或上下文,您希望 AI 在生成建议时考虑这些内容。

const { chatSuggestions, generateChatSuggestion } = useCopilotChat({
  currentUserMessage: userMessage,
  conversationHistory: conversationLog,
  productDetails: productInfo,
});

3. 渲染聊天建议: 使用钩子返回的 chatSuggestions 在您的用户界面中渲染 AI 生成的建议。您可以将这些建议显示为按钮、链接或任何其他交互式 UI 元素。

return (
  <div>
    {chatSuggestions.map((suggestion, index) => (
      <button key={index} onClick={() => handleSuggestionClick(suggestion)}>
        {suggestion.text}
      </button>
    ))}
  </div>
);

4. 处理用户交互: 当用户选择一个建议时,您可以调用钩子提供的 generateChatSuggestion 函数,根据更新的应用程序状态触发新一轮建议的生成。

const handleSuggestionClick = (suggestion) => {
  const newSuggestions = generateChatSuggestion(suggestion);
  // 相应地更新您的应用程序状态和 UI
};

通过使用 useCopilotChat 钩子,您可以无缝地将 AI 驱动的聊天建议集成到您的应用程序中,增强用户体验,使您的用户更容易与您的产品互动。

要将 CopilotKit 集成到您的类电子表格应用程序中,您需要遵循以下步骤:

1. 设置 CopilotKit Provider: 首先使用 CopilotKitProvider 组件包装您的应用程序。这提供了必要的业务逻辑,将您的应用程序连接到 CopilotKit API。您需要使用从 CopilotCloud 仪表板获得的 CopilotCloud 公共 API 密钥来初始化该提供程序。

2. 利用 CopilotSidebar: CopilotKit 提供了一个预构建的 CopilotSidebar 组件,您可以使用它在您的应用程序中渲染 AI 驱动的助手界面。这个组件是完全可定制的,允许您将其无缝集成到现有的 UI 中。

3. 使用 useCopilotReadable 提供上下文: 使用 useCopilotReadable 钩子将相关数据从您的应用程序传递到 CopilotKit 引擎。这可能包括当前的电子表格数据、用户信息或任何其他上下文信息,AI 助手可以利用这些信息提供更准确和相关的响应。

4. 使用 useCopilotAction 启用 AI 操作: 利用 useCopilotAction 钩子允许 CopilotKit 助手在您的应用程序中执行操作。例如,在电子表格用例中,您可以使用此钩子来建议电子表格覆盖或根据用户输入生成自定义 React 组件。

5. 使用生成式 UI 定制 UI: CopilotKit 的生成式 UI 功能允许您在聊天界面中渲染完全自定义的 React 组件。这使您能够创建一个无缝和集成的用户体验,AI 助手可以直接在您的应用程序中生成和显示丰富的交互式内容。

通过遵循这些步骤,您可以轻松地将强大的 CopilotKit 框架集成到您的类电子表格应用程序中,为您的用户提供一个 AI 驱动的助手,帮助他们更高效地浏览和交互数据。

CopilotText Area 是 Copilot Kit 框架的一个强大功能,它允许您将 AI 驱动的文本编辑功能直接集成到您的应用程序中。这是您应用程序中任何文本区域的即插即用替代品,为用户提供 AI 辅助的文本编辑,提高他们的生产力和效率。

使用 CopilotText Area,用户可以利用 AI 驱动的自动完成、文本生成和其他智能功能来简化他们的写作任务。例如,在 CRM 应用程序中,用户可以利用 CopilotText Area 自动生成电子邮件回复、总结客户痛点,并标记以前对话中的相关上下文。

CopilotText Area 的集成非常简单。只需将现有的文本区域替换为 CopilotTextArea 组件,并提供必要的配置,如 autoSuggestionsConfig。这允许 Copilot Kit 无缝地将 AI 驱动的文本编辑功能集成到您的应用程序中,无需复杂的自定义实现。

通过利用 CopilotText Area,您可以为用户提供 AI 辅助的文本编辑,提高他们的生产力,并增强他们在您应用程序中的整体体验。

Copilot Kit 1.0 版本的发布是一个重大升级,引入了几个关键的增强功能。引入时尚的生成式 UI 允许开发人员在聊天界面中渲染完全自定义的 React 组件,使他们能够将 AI 驱动的功能无缝集成到应用程序中。

集成基于 GraphQL 的协议,支持输入和输出字段以及数据流,增强了 Copilot 运行时的实时功能。新的 React SDK 钩子,如 useCopilotAction 和 useCopilotChatSuggestion,为开发人员提供了在应用程序中直接交互的机制,而 useCopilotReadable 钩子