新版 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,允許開發人員在聊天界面中渲染完全自定