@liveblocks/react-ui 2.25.0-aiprivatebeta8 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (181) hide show
  1. package/_private/package.json +2 -2
  2. package/dist/_private/index.cjs +14 -12
  3. package/dist/_private/index.cjs.map +1 -1
  4. package/dist/_private/index.d.cts +146 -113
  5. package/dist/_private/index.d.ts +146 -113
  6. package/dist/_private/index.js +10 -5
  7. package/dist/_private/index.js.map +1 -1
  8. package/dist/components/AiChat.cjs +85 -121
  9. package/dist/components/AiChat.cjs.map +1 -1
  10. package/dist/components/AiChat.js +87 -123
  11. package/dist/components/AiChat.js.map +1 -1
  12. package/dist/components/AiTool.cjs +188 -0
  13. package/dist/components/AiTool.cjs.map +1 -0
  14. package/dist/components/AiTool.js +186 -0
  15. package/dist/components/AiTool.js.map +1 -0
  16. package/dist/components/Comment.cjs +259 -238
  17. package/dist/components/Comment.cjs.map +1 -1
  18. package/dist/components/Comment.js +261 -240
  19. package/dist/components/Comment.js.map +1 -1
  20. package/dist/components/Composer.cjs +42 -30
  21. package/dist/components/Composer.cjs.map +1 -1
  22. package/dist/components/Composer.js +44 -32
  23. package/dist/components/Composer.js.map +1 -1
  24. package/dist/components/InboxNotificationList.cjs +11 -3
  25. package/dist/components/InboxNotificationList.cjs.map +1 -1
  26. package/dist/components/InboxNotificationList.js +12 -4
  27. package/dist/components/InboxNotificationList.js.map +1 -1
  28. package/dist/components/Thread.cjs +7 -1
  29. package/dist/components/Thread.cjs.map +1 -1
  30. package/dist/components/Thread.js +8 -2
  31. package/dist/components/Thread.js.map +1 -1
  32. package/dist/components/internal/AiChatAssistantMessage.cjs +75 -199
  33. package/dist/components/internal/AiChatAssistantMessage.cjs.map +1 -1
  34. package/dist/components/internal/AiChatAssistantMessage.js +77 -201
  35. package/dist/components/internal/AiChatAssistantMessage.js.map +1 -1
  36. package/dist/components/internal/AiChatComposer.cjs +1 -1
  37. package/dist/components/internal/AiChatComposer.cjs.map +1 -1
  38. package/dist/components/internal/AiChatComposer.js +1 -1
  39. package/dist/components/internal/AiChatComposer.js.map +1 -1
  40. package/dist/components/internal/AiChatUserMessage.cjs +17 -10
  41. package/dist/components/internal/AiChatUserMessage.cjs.map +1 -1
  42. package/dist/components/internal/AiChatUserMessage.js +17 -10
  43. package/dist/components/internal/AiChatUserMessage.js.map +1 -1
  44. package/dist/components/internal/Button.cjs.map +1 -1
  45. package/dist/components/internal/Button.js.map +1 -1
  46. package/dist/components/internal/CodeBlock.cjs +75 -0
  47. package/dist/components/internal/CodeBlock.cjs.map +1 -0
  48. package/dist/components/internal/CodeBlock.js +73 -0
  49. package/dist/components/internal/CodeBlock.js.map +1 -0
  50. package/dist/components/internal/Dropdown.cjs +1 -1
  51. package/dist/components/internal/Dropdown.cjs.map +1 -1
  52. package/dist/components/internal/Dropdown.js +2 -2
  53. package/dist/components/internal/Dropdown.js.map +1 -1
  54. package/dist/components/internal/Emoji.cjs +12 -4
  55. package/dist/components/internal/Emoji.cjs.map +1 -1
  56. package/dist/components/internal/Emoji.js +12 -4
  57. package/dist/components/internal/Emoji.js.map +1 -1
  58. package/dist/components/internal/EmojiPicker.cjs +1 -1
  59. package/dist/components/internal/EmojiPicker.cjs.map +1 -1
  60. package/dist/components/internal/EmojiPicker.js +2 -2
  61. package/dist/components/internal/EmojiPicker.js.map +1 -1
  62. package/dist/components/internal/InboxNotificationThread.cjs +5 -2
  63. package/dist/components/internal/InboxNotificationThread.cjs.map +1 -1
  64. package/dist/components/internal/InboxNotificationThread.js +6 -3
  65. package/dist/components/internal/InboxNotificationThread.js.map +1 -1
  66. package/dist/components/internal/Prose.cjs +37 -0
  67. package/dist/components/internal/Prose.cjs.map +1 -0
  68. package/dist/components/internal/Prose.js +35 -0
  69. package/dist/components/internal/Prose.js.map +1 -0
  70. package/dist/components/internal/Tooltip.cjs +1 -1
  71. package/dist/components/internal/Tooltip.cjs.map +1 -1
  72. package/dist/components/internal/Tooltip.js +2 -2
  73. package/dist/components/internal/Tooltip.js.map +1 -1
  74. package/dist/config.cjs +9 -9
  75. package/dist/config.cjs.map +1 -1
  76. package/dist/config.js +8 -8
  77. package/dist/config.js.map +1 -1
  78. package/dist/icons/CrossCircleFill.cjs +25 -0
  79. package/dist/icons/CrossCircleFill.cjs.map +1 -0
  80. package/dist/icons/CrossCircleFill.js +23 -0
  81. package/dist/icons/CrossCircleFill.js.map +1 -0
  82. package/dist/icons/MinusCircle.cjs +23 -0
  83. package/dist/icons/MinusCircle.cjs.map +1 -0
  84. package/dist/icons/MinusCircle.js +21 -0
  85. package/dist/icons/MinusCircle.js.map +1 -0
  86. package/dist/icons/index.cjs +4 -0
  87. package/dist/icons/index.cjs.map +1 -1
  88. package/dist/icons/index.js +2 -0
  89. package/dist/icons/index.js.map +1 -1
  90. package/dist/index.cjs +3 -3
  91. package/dist/index.cjs.map +1 -1
  92. package/dist/index.d.cts +270 -22
  93. package/dist/index.d.ts +270 -22
  94. package/dist/index.js +2 -2
  95. package/dist/index.js.map +1 -1
  96. package/dist/overrides.cjs +6 -4
  97. package/dist/overrides.cjs.map +1 -1
  98. package/dist/overrides.js +6 -4
  99. package/dist/overrides.js.map +1 -1
  100. package/dist/primitives/AiMessage/contexts.cjs +18 -0
  101. package/dist/primitives/AiMessage/contexts.cjs.map +1 -0
  102. package/dist/primitives/AiMessage/contexts.js +15 -0
  103. package/dist/primitives/AiMessage/contexts.js.map +1 -0
  104. package/dist/primitives/AiMessage/index.cjs +77 -0
  105. package/dist/primitives/AiMessage/index.cjs.map +1 -0
  106. package/dist/primitives/AiMessage/index.js +75 -0
  107. package/dist/primitives/AiMessage/index.js.map +1 -0
  108. package/dist/primitives/AiMessage/tool-invocation.cjs +70 -0
  109. package/dist/primitives/AiMessage/tool-invocation.cjs.map +1 -0
  110. package/dist/primitives/AiMessage/tool-invocation.js +68 -0
  111. package/dist/primitives/AiMessage/tool-invocation.js.map +1 -0
  112. package/dist/primitives/{internal/Collapsible → Collapsible}/index.cjs +39 -17
  113. package/dist/primitives/Collapsible/index.cjs.map +1 -0
  114. package/dist/primitives/{internal/Collapsible → Collapsible}/index.js +37 -15
  115. package/dist/primitives/Collapsible/index.js.map +1 -0
  116. package/dist/primitives/Comment/index.cjs +5 -4
  117. package/dist/primitives/Comment/index.cjs.map +1 -1
  118. package/dist/primitives/Comment/index.js +5 -4
  119. package/dist/primitives/Comment/index.js.map +1 -1
  120. package/dist/primitives/Composer/index.cjs +49 -41
  121. package/dist/primitives/Composer/index.cjs.map +1 -1
  122. package/dist/primitives/Composer/index.js +50 -42
  123. package/dist/primitives/Composer/index.js.map +1 -1
  124. package/dist/primitives/Composer/slate/plugins/mentions.cjs +4 -4
  125. package/dist/primitives/Composer/slate/plugins/mentions.cjs.map +1 -1
  126. package/dist/primitives/Composer/slate/plugins/mentions.js +4 -4
  127. package/dist/primitives/Composer/slate/plugins/mentions.js.map +1 -1
  128. package/dist/primitives/Composer/utils.cjs +3 -6
  129. package/dist/primitives/Composer/utils.cjs.map +1 -1
  130. package/dist/primitives/Composer/utils.js +3 -6
  131. package/dist/primitives/Composer/utils.js.map +1 -1
  132. package/dist/primitives/{internal/Markdown.cjs → Markdown.cjs} +105 -65
  133. package/dist/primitives/Markdown.cjs.map +1 -0
  134. package/dist/primitives/{internal/Markdown.js → Markdown.js} +106 -65
  135. package/dist/primitives/Markdown.js.map +1 -0
  136. package/dist/primitives/index.cjs +4 -6
  137. package/dist/primitives/index.cjs.map +1 -1
  138. package/dist/primitives/index.d.cts +20 -93
  139. package/dist/primitives/index.d.ts +20 -93
  140. package/dist/primitives/index.js +4 -6
  141. package/dist/primitives/index.js.map +1 -1
  142. package/dist/utils/ErrorBoundary.cjs +48 -0
  143. package/dist/utils/ErrorBoundary.cjs.map +1 -0
  144. package/dist/utils/ErrorBoundary.js +45 -0
  145. package/dist/utils/ErrorBoundary.js.map +1 -0
  146. package/dist/utils/use-controllable-state.cjs +25 -2
  147. package/dist/utils/use-controllable-state.cjs.map +1 -1
  148. package/dist/utils/use-controllable-state.js +25 -3
  149. package/dist/utils/use-controllable-state.js.map +1 -1
  150. package/dist/utils/use-visible.cjs +65 -45
  151. package/dist/utils/use-visible.cjs.map +1 -1
  152. package/dist/utils/use-visible.js +66 -46
  153. package/dist/utils/use-visible.js.map +1 -1
  154. package/dist/version.cjs +1 -1
  155. package/dist/version.cjs.map +1 -1
  156. package/dist/version.js +1 -1
  157. package/dist/version.js.map +1 -1
  158. package/package.json +16 -5
  159. package/primitives/package.json +2 -2
  160. package/src/styles/constants.css +1 -1
  161. package/src/styles/dark/index.css +7 -3
  162. package/src/styles/index.css +572 -252
  163. package/src/styles/utils.css +1 -1
  164. package/styles/dark/attributes.css +1 -1
  165. package/styles/dark/attributes.css.map +1 -1
  166. package/styles/dark/media-query.css +1 -1
  167. package/styles/dark/media-query.css.map +1 -1
  168. package/styles.css +1 -1
  169. package/styles.css.map +1 -1
  170. package/dist/components/AiToolDebugger.cjs +0 -74
  171. package/dist/components/AiToolDebugger.cjs.map +0 -1
  172. package/dist/components/AiToolDebugger.js +0 -72
  173. package/dist/components/AiToolDebugger.js.map +0 -1
  174. package/dist/primitives/internal/Collapsible/index.cjs.map +0 -1
  175. package/dist/primitives/internal/Collapsible/index.js.map +0 -1
  176. package/dist/primitives/internal/Emoji.cjs +0 -32
  177. package/dist/primitives/internal/Emoji.cjs.map +0 -1
  178. package/dist/primitives/internal/Emoji.js +0 -30
  179. package/dist/primitives/internal/Emoji.js.map +0 -1
  180. package/dist/primitives/internal/Markdown.cjs.map +0 -1
  181. package/dist/primitives/internal/Markdown.js.map +0 -1
package/dist/index.cjs CHANGED
@@ -3,7 +3,7 @@
3
3
  var core = require('@liveblocks/core');
4
4
  var version = require('./version.cjs');
5
5
  var AiChat = require('./components/AiChat.cjs');
6
- var AiToolDebugger = require('./components/AiToolDebugger.cjs');
6
+ var AiTool = require('./components/AiTool.cjs');
7
7
  var Comment = require('./components/Comment.cjs');
8
8
  var Composer = require('./components/Composer.cjs');
9
9
  var HistoryVersionSummary = require('./components/HistoryVersionSummary.cjs');
@@ -18,7 +18,7 @@ var overrides = require('./overrides.cjs');
18
18
  core.detectDupes(version.PKG_NAME, version.PKG_VERSION, version.PKG_FORMAT);
19
19
 
20
20
  exports.AiChat = AiChat.AiChat;
21
- exports.AiToolDebugger = AiToolDebugger.AiToolDebugger;
21
+ exports.AiTool = AiTool.AiTool;
22
22
  exports.Comment = Comment.Comment;
23
23
  exports.Composer = Composer.Composer;
24
24
  exports.HistoryVersionSummary = HistoryVersionSummary.HistoryVersionSummary;
@@ -26,7 +26,7 @@ exports.HistoryVersionSummaryList = HistoryVersionSummaryList.HistoryVersionSumm
26
26
  exports.InboxNotification = InboxNotification.InboxNotification;
27
27
  exports.InboxNotificationList = InboxNotificationList.InboxNotificationList;
28
28
  exports.Thread = Thread.Thread;
29
- exports.LiveblocksUIConfig = config.LiveblocksUIConfig;
29
+ exports.LiveblocksUiConfig = config.LiveblocksUiConfig;
30
30
  exports.Icon = icon;
31
31
  exports.useOverrides = overrides.useOverrides;
32
32
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type { AiChatProps } from \"./components/AiChat\";\nexport { AiChat } from \"./components/AiChat\";\nexport { AiToolDebugger } from \"./components/AiToolDebugger\";\nexport type { CommentProps } from \"./components/Comment\";\nexport { Comment } from \"./components/Comment\";\nexport type { ComposerProps } from \"./components/Composer\";\nexport { Composer } from \"./components/Composer\";\nexport type { HistoryVersionSummaryProps } from \"./components/HistoryVersionSummary\";\nexport { HistoryVersionSummary } from \"./components/HistoryVersionSummary\";\nexport type { HistoryVersionSummaryListProps } from \"./components/HistoryVersionSummaryList\";\nexport { HistoryVersionSummaryList } from \"./components/HistoryVersionSummaryList\";\nexport type {\n InboxNotificationAvatarProps,\n InboxNotificationCustomKindProps,\n InboxNotificationCustomProps,\n InboxNotificationIconProps,\n InboxNotificationProps,\n InboxNotificationTextMentionKindProps,\n InboxNotificationTextMentionProps,\n InboxNotificationThreadKindProps,\n InboxNotificationThreadProps,\n} from \"./components/InboxNotification\";\nexport { InboxNotification } from \"./components/InboxNotification\";\nexport type { InboxNotificationListProps } from \"./components/InboxNotificationList\";\nexport { InboxNotificationList } from \"./components/InboxNotificationList\";\nexport type { ThreadProps } from \"./components/Thread\";\nexport { Thread } from \"./components/Thread\";\nexport { LiveblocksUIConfig } from \"./config\";\nexport * as Icon from \"./icon\";\nexport type {\n CommentOverrides,\n ComposerOverrides,\n GlobalOverrides,\n InboxNotificationOverrides,\n LocalizationOverrides,\n Overrides,\n ThreadOverrides,\n} from \"./overrides\";\nexport { useOverrides } from \"./overrides\";\nexport type { ComposerSubmitComment } from \"./primitives\";\nexport type {\n CommentAttachmentArgs,\n ComposerBodyMark,\n ComposerBodyMarks,\n} from \"./types\";\n"],"names":["detectDupes","PKG_NAME","PKG_VERSION","PKG_FORMAT"],"mappings":";;;;;;;;;;;;;;;;;AAIAA,gBAAY,CAAAC,gBAAA,EAAUC,qBAAaC,kBAAU,CAAA;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.cjs","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type {\n AiChatComponents,\n AiChatComponentsEmptyProps,\n AiChatComponentsLoadingProps,\n AiChatProps,\n} from \"./components/AiChat\";\nexport { AiChat } from \"./components/AiChat\";\nexport type { AiToolIconProps, AiToolProps } from \"./components/AiTool\";\nexport { AiTool } from \"./components/AiTool\";\nexport type { CommentProps } from \"./components/Comment\";\nexport { Comment } from \"./components/Comment\";\nexport type { ComposerProps } from \"./components/Composer\";\nexport { Composer } from \"./components/Composer\";\nexport type { HistoryVersionSummaryProps } from \"./components/HistoryVersionSummary\";\nexport { HistoryVersionSummary } from \"./components/HistoryVersionSummary\";\nexport type { HistoryVersionSummaryListProps } from \"./components/HistoryVersionSummaryList\";\nexport { HistoryVersionSummaryList } from \"./components/HistoryVersionSummaryList\";\nexport type {\n InboxNotificationAvatarProps,\n InboxNotificationCustomKindProps,\n InboxNotificationCustomProps,\n InboxNotificationIconProps,\n InboxNotificationProps,\n InboxNotificationTextMentionKindProps,\n InboxNotificationTextMentionProps,\n InboxNotificationThreadKindProps,\n InboxNotificationThreadProps,\n} from \"./components/InboxNotification\";\nexport { InboxNotification } from \"./components/InboxNotification\";\nexport type { InboxNotificationListProps } from \"./components/InboxNotificationList\";\nexport { InboxNotificationList } from \"./components/InboxNotificationList\";\nexport type { ThreadProps } from \"./components/Thread\";\nexport { Thread } from \"./components/Thread\";\nexport { LiveblocksUiConfig } from \"./config\";\nexport * as Icon from \"./icon\";\nexport type {\n CommentOverrides,\n ComposerOverrides,\n GlobalOverrides,\n InboxNotificationOverrides,\n LocalizationOverrides,\n Overrides,\n ThreadOverrides,\n} from \"./overrides\";\nexport { useOverrides } from \"./overrides\";\nexport type { ComposerSubmitComment } from \"./primitives\";\nexport type {\n CommentAttachmentArgs,\n ComposerBodyMark,\n ComposerBodyMarks,\n} from \"./types\";\n"],"names":["detectDupes","PKG_NAME","PKG_VERSION","PKG_FORMAT"],"mappings":";;;;;;;;;;;;;;;;;AAIAA,gBAAY,CAAAC,gBAAA,EAAUC,qBAAaC,kBAAU,CAAA;;;;;;;;;;;;;;;"}
package/dist/index.d.cts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as react from 'react';
2
2
  import { ComponentType, ComponentPropsWithoutRef, ElementType, ReactNode, ComponentProps, FormEvent, RefAttributes, MouseEvent, PropsWithChildren } from 'react';
3
- import { CommentAttachment, AiKnowledgeSource, AiToolDefinition, AiToolDefinitionRenderProps, CommentBody, BaseMetadata, DM, CommentData, HistoryVersion, InboxNotificationData, InboxNotificationThreadData, InboxNotificationTextMentionData, InboxNotificationCustomData, KDAD, ThreadData } from '@liveblocks/core';
3
+ import { CommentAttachment, AiKnowledgeSource, AiOpaqueToolDefinition, AiToolTypePack, JsonObject, AiToolExecuteCallback, NoInfr, CommentBody, MentionData, BaseMetadata, DM, CommentData, HistoryVersion, InboxNotificationData, InboxNotificationThreadData, InboxNotificationTextMentionData, InboxNotificationCustomData, KDAD, ThreadData } from '@liveblocks/core';
4
4
  import * as react_jsx_runtime from 'react/jsx-runtime';
5
5
 
6
6
  interface GlobalComponents {
@@ -54,6 +54,7 @@ interface GlobalOverrides {
54
54
  EMOJI_PICKER_CHANGE_SKIN_TONE: string;
55
55
  ATTACHMENT_TOO_LARGE: (maxSize?: string) => string;
56
56
  ATTACHMENT_ERROR: (error: Error) => string;
57
+ COPY_TO_CLIPBOARD: string;
57
58
  }
58
59
  interface CommentOverrides {
59
60
  COMMENT_EDITED: ReactNode;
@@ -78,6 +79,10 @@ interface ComposerOverrides {
78
79
  COMPOSER_SEND: string;
79
80
  COMPOSER_TOGGLE_MARK: (mark: ComposerBodyMark) => string;
80
81
  }
82
+ interface AiToolConfirmationOverrides {
83
+ AI_TOOL_CONFIRMATION_CONFIRM: string;
84
+ AI_TOOL_CONFIRMATION_CANCEL: string;
85
+ }
81
86
  interface AiChatComposerOverrides {
82
87
  AI_CHAT_COMPOSER_PLACEHOLDER: string;
83
88
  AI_CHAT_COMPOSER_SEND: string;
@@ -86,6 +91,7 @@ interface AiChatComposerOverrides {
86
91
  interface AiChatMessageOverrides {
87
92
  AI_CHAT_MESSAGE_DELETED: string;
88
93
  AI_CHAT_MESSAGE_THINKING: string;
94
+ AI_CHAT_MESSAGE_REASONING: (isStreaming: boolean) => string;
89
95
  }
90
96
  interface AiChatOverrides {
91
97
  AI_CHAT_MESSAGES_ERROR: (error: Error) => ReactNode;
@@ -114,9 +120,30 @@ interface HistoryVersionPreviewOverrides {
114
120
  HISTORY_VERSION_PREVIEW_EMPTY: ReactNode;
115
121
  HISTORY_VERSION_PREVIEW_ERROR: (error: Error) => ReactNode;
116
122
  }
117
- type Overrides = LocalizationOverrides & GlobalOverrides & ComposerOverrides & CommentOverrides & ThreadOverrides & InboxNotificationOverrides & HistoryVersionPreviewOverrides & AiChatComposerOverrides & AiChatMessageOverrides & AiChatOverrides;
123
+ type Overrides = LocalizationOverrides & GlobalOverrides & ComposerOverrides & CommentOverrides & ThreadOverrides & InboxNotificationOverrides & HistoryVersionPreviewOverrides & AiChatComposerOverrides & AiChatMessageOverrides & AiChatOverrides & AiToolConfirmationOverrides;
118
124
  declare function useOverrides(overrides?: Partial<Overrides>): Overrides;
119
125
 
126
+ type AiChatComponentsEmptyProps = {
127
+ /**
128
+ * The chat id provided to the `AiChat` component.
129
+ */
130
+ chatId: string;
131
+ /**
132
+ * The copilot id provided to the `AiChat` component.
133
+ */
134
+ copilotId?: string;
135
+ };
136
+ type AiChatComponentsLoadingProps = Record<string, never>;
137
+ type AiChatComponents = {
138
+ /**
139
+ * The component used to render the empty state of the chat.
140
+ */
141
+ Empty: ComponentType<AiChatComponentsEmptyProps>;
142
+ /**
143
+ * The component used to render the loading state of the chat.
144
+ */
145
+ Loading: ComponentType<AiChatComponentsLoadingProps>;
146
+ };
120
147
  interface AiChatProps extends ComponentProps<"div"> {
121
148
  /**
122
149
  * The id of the chat the composer belongs to.
@@ -138,7 +165,11 @@ interface AiChatProps extends ComponentProps<"div"> {
138
165
  /**
139
166
  * Tool definitions to make available within this chat. May be used by the assistant when generating responses.
140
167
  */
141
- tools?: Record<string, AiToolDefinition>;
168
+ tools?: Record<string, AiOpaqueToolDefinition>;
169
+ /**
170
+ * The layout of the chat and its composer.
171
+ */
172
+ layout?: "inset" | "compact";
142
173
  /**
143
174
  * Override the component's strings.
144
175
  */
@@ -146,18 +177,227 @@ interface AiChatProps extends ComponentProps<"div"> {
146
177
  /**
147
178
  * Override the component's components.
148
179
  */
149
- components?: Partial<GlobalComponents>;
180
+ components?: Partial<GlobalComponents & AiChatComponents>;
150
181
  }
151
182
  declare const AiChat: react.ForwardRefExoticComponent<Omit<AiChatProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
152
183
 
184
+ interface AiToolProps extends Omit<ComponentProps<"div">, "title" | "children"> {
185
+ /**
186
+ * The tool's title.
187
+ *
188
+ * By default, a human-readable version of the tool's name is used:
189
+ * - `"showTodo"` → "Show todo"
190
+ * - `"get_weather"` → "Get weather"
191
+ */
192
+ title?: string;
193
+ /**
194
+ * An optional icon displayed next to the title.
195
+ */
196
+ icon?: ReactNode;
197
+ /**
198
+ * The content shown in the tool.
199
+ */
200
+ children?: ReactNode;
201
+ /**
202
+ * Whether the content is currently collapsed.
203
+ * It is not a traditional controlled value, as in if you set it to `true` it would only stay expanded.
204
+ * Instead, it is "semi-controlled", meaning that setting it to `true` will expand it, but it
205
+ * can still be collapsed/expanded by clicking on it.
206
+ */
207
+ collapsed?: boolean;
208
+ /**
209
+ * The event handler called when the content is collapsed or expanded by clicking on it.
210
+ */
211
+ onCollapsedChange?: (collapsed: boolean) => void;
212
+ }
213
+ type AiToolIconProps = ComponentProps<"div">;
214
+ type AiToolInspectorProps = ComponentProps<"div">;
215
+ interface AiToolConfirmationProps<A extends JsonObject, R extends JsonObject> extends ComponentProps<"div"> {
216
+ /**
217
+ * The callback invoked when the user clicks the confirm button.
218
+ */
219
+ confirm: AiToolExecuteCallback<A, R>;
220
+ /**
221
+ * The callback invoked when the user clicks the cancel button.
222
+ */
223
+ cancel?: AiToolExecuteCallback<A, R>;
224
+ /**
225
+ * The visual appearance.
226
+ */
227
+ variant?: "default" | "destructive";
228
+ /**
229
+ * Override the component's strings.
230
+ */
231
+ overrides?: Partial<GlobalOverrides & AiToolConfirmationOverrides>;
232
+ /**
233
+ * The tool's result type, to be used with the `types` prop in the `render` method.
234
+ *
235
+ * @example
236
+ * defineAiTool<{ value: number }>()({
237
+ * // ...
238
+ * render: ({ types }) => (
239
+ * <AiTool.Confirmation
240
+ * types={types}
241
+ * confirm={() => {
242
+ * return {
243
+ * // Using `types` makes the result type-safe
244
+ * // based on the tool's definition
245
+ * data: { value: 123 },
246
+ * };
247
+ * }}
248
+ * />
249
+ * ),
250
+ * })
251
+ */
252
+ types?: NoInfr<AiToolTypePack<A, R>>;
253
+ }
254
+ declare function AiToolIcon({ className, ...props }: AiToolIconProps): react_jsx_runtime.JSX.Element;
255
+ declare function AiToolInspector({ className, ...props }: AiToolInspectorProps): react_jsx_runtime.JSX.Element;
256
+ declare function AiToolConfirmation<TPack extends AiToolTypePack, A extends JsonObject = TPack["A"], R extends JsonObject = TPack["R"]>({ children, variant, confirm, cancel, overrides, className, ...props }: AiToolConfirmationProps<A, R>): react_jsx_runtime.JSX.Element | null;
153
257
  /**
154
- * @experimental
155
- * Helper to debug tool invocations.
258
+ * A pre-built component which displays a tool call.
259
+ *
260
+ * By default, a human-readable version of the tool's name is used as a title:
261
+ * - `"showTodo"` → "Show todo"
262
+ * - `"get_weather"` → "Get weather"
263
+ *
264
+ * @example
265
+ * defineAiTool()({
266
+ * // ...
267
+ * render: () => (
268
+ * <AiTool />
269
+ * ),
270
+ * })
271
+ *
272
+ * It can be customized in various ways:
273
+ * - adding an icon
274
+ * - customizing the title (even dynamically)
275
+ * - adding custom content inside it
276
+ * - collapsing it conditionally
277
+ * - etc.
278
+ *
279
+ * @example
280
+ * defineAiTool()({
281
+ * // ...
282
+ * render: ({ stage, result }) => (
283
+ * <AiTool
284
+ * icon="🔍"
285
+ *
286
+ * // Override the default title based on the tool's stage
287
+ * title={stage === "executing" ? "Searching…" : "Search results"}
288
+ *
289
+ * // Start open and automatically collapse after it is executed
290
+ * // The user can still expand/collapse it manually at any time
291
+ * collapsed={stage === "executed"}
292
+ * >
293
+ * <SearchResults data={result.data} />
294
+ * </AiTool>
295
+ * ),
296
+ * })
297
+ *
298
+ * It also comes with a few built-in sub-components:
299
+ * - `AiTool.Confirmation` to display a human-in-the-loop confirmation step
300
+ * which can be accepted or cancelled by the user.
301
+ * - `AiTool.Inspector` to display the tool's arguments and result which can
302
+ * be useful during development.
156
303
  *
157
- * Simply drop this into your tool definition's `render` property to visually
158
- * see what's going on with your tool calls.
304
+ * @example
305
+ * defineAiTool()({
306
+ * // ...
307
+ * render: () => (
308
+ * <AiTool>
309
+ * <AiTool.Confirmation
310
+ * // Use a destructive visual appearance
311
+ * variant="destructive"
312
+ *
313
+ * // The tool's arguments can be directly accessed like in `execute`
314
+ * confirm={({ pageIds }) => {
315
+ * const deletedPageTitles = pages
316
+ * .filter((p) => pageIds.includes(p.id))
317
+ * .map((page) => page.title);
318
+ *
319
+ * deletePages(pageIds);
320
+ *
321
+ * // This result will be available as `result` in the tool's `render` props
322
+ * return { data: { deletedPageTitles } };
323
+ * }}
324
+ *
325
+ * // If needed, `cancel={() => ...}` would work similarly
326
+ * >
327
+ * Do you want to delete these pages?
328
+ * <PagesPreviews />
329
+ * </AiTool.Confirmation>
330
+ * </AiTool>
331
+ * ),
332
+ * })
333
+ *
334
+ * @example
335
+ * defineAiTool()({
336
+ * // ...
337
+ * render: () => (
338
+ * <AiTool>
339
+ * <AiTool.Inspector />
340
+ * </AiTool>
341
+ * ),
342
+ * })
159
343
  */
160
- declare function AiToolDebugger(props: AiToolDefinitionRenderProps): react_jsx_runtime.JSX.Element;
344
+ declare const AiTool: react.ForwardRefExoticComponent<Omit<AiToolProps, "ref"> & react.RefAttributes<HTMLDivElement>> & {
345
+ /**
346
+ * Display an icon in a container.
347
+ *
348
+ * @example
349
+ * <AiTool
350
+ * icon={
351
+ * <AiTool.Icon>🔍</AiTool.Icon>
352
+ * }
353
+ * />
354
+ */
355
+ Icon: typeof AiToolIcon;
356
+ /**
357
+ * Display the tool's arguments and result, which can be useful during
358
+ * development.
359
+ *
360
+ * @example
361
+ * <AiTool>
362
+ * <AiTool.Inspector />
363
+ * </AiTool>
364
+ */
365
+ Inspector: typeof AiToolInspector;
366
+ /**
367
+ * Display a human-in-the-loop confirmation step which can be accepted
368
+ * or cancelled by the user.
369
+ *
370
+ * The `confirm` and `cancel` callbacks work like `execute` in tool definitions: they can
371
+ * perform side-effects, be async if needed, and return a result. The tool call will stay
372
+ * pending until either `confirm` or `cancel` is called.
373
+ *
374
+ * @example
375
+ * <AiTool>
376
+ * <AiTool.Confirmation
377
+ * // Use a destructive visual appearance
378
+ * variant="destructive"
379
+ *
380
+ * // The tool's arguments can be directly accessed like in `execute`
381
+ * confirm={({ pageIds }) => {
382
+ * const deletedPageTitles = pages
383
+ * .filter((p) => pageIds.includes(p.id))
384
+ * .map((page) => page.title);
385
+ *
386
+ * deletePages(pageIds);
387
+ *
388
+ * // This result will be available as `result` in the tool's `render` props
389
+ * return { data: { deletedPageTitles } };
390
+ * }}
391
+ *
392
+ * // If needed, `cancel={() => ...}` would work similarly
393
+ * >
394
+ * Do you want to delete these pages?
395
+ * <PagesPreviews />
396
+ * </AiTool.Confirmation>
397
+ * </AiTool>
398
+ */
399
+ Confirmation: typeof AiToolConfirmation;
400
+ };
161
401
 
162
402
  interface ComposerEditorMentionProps {
163
403
  /**
@@ -165,9 +405,9 @@ interface ComposerEditorMentionProps {
165
405
  */
166
406
  isSelected: boolean;
167
407
  /**
168
- * The mention's user ID.
408
+ * The mention to display.
169
409
  */
170
- userId: string;
410
+ mention: MentionData;
171
411
  }
172
412
  interface ComposerEditorLinkProps {
173
413
  /**
@@ -185,13 +425,13 @@ interface ComposerEditorLinkProps {
185
425
  }
186
426
  type ComposerEditorMentionSuggestionsProps = {
187
427
  /**
188
- * The list of suggested user IDs.
428
+ * The list of mention suggestions.
189
429
  */
190
- userIds: string[];
430
+ mentions: MentionData[];
191
431
  /**
192
- * The currently selected user ID.
432
+ * The currently selected mention's ID.
193
433
  */
194
- selectedUserId?: string;
434
+ selectedMentionId?: string;
195
435
  };
196
436
  type ComposerEditorFloatingToolbarProps = Record<string, never>;
197
437
  interface ComposerEditorComponents {
@@ -212,7 +452,7 @@ interface ComposerEditorComponents {
212
452
  */
213
453
  FloatingToolbar?: ComponentType<ComposerEditorFloatingToolbarProps>;
214
454
  }
215
- interface ComposerEditorProps extends Omit<ComponentPropsWithoutRef<"div">, "defaultValue"> {
455
+ interface ComposerEditorProps extends Omit<ComponentPropsWithoutRef<"div">, "defaultValue" | "children"> {
216
456
  /**
217
457
  * The reading direction of the editor and related elements.
218
458
  */
@@ -405,7 +645,7 @@ interface CommentProps extends ComponentPropsWithoutRef<"div"> {
405
645
  /**
406
646
  * The event handler called when clicking on a mention.
407
647
  */
408
- onMentionClick?: (userId: string, event: MouseEvent<HTMLElement>) => void;
648
+ onMentionClick?: (mention: MentionData, event: MouseEvent<HTMLElement>) => void;
409
649
  /**
410
650
  * The event handler called when clicking on a comment's attachment.
411
651
  */
@@ -414,6 +654,10 @@ interface CommentProps extends ComponentPropsWithoutRef<"div"> {
414
654
  * Override the component's strings.
415
655
  */
416
656
  overrides?: Partial<GlobalOverrides & CommentOverrides & ComposerOverrides>;
657
+ /**
658
+ * Override the component's components.
659
+ */
660
+ components?: Partial<GlobalComponents>;
417
661
  }
418
662
  /**
419
663
  * Displays a single comment.
@@ -671,6 +915,10 @@ interface ThreadProps<M extends BaseMetadata = DM> extends ComponentPropsWithout
671
915
  * Override the component's strings.
672
916
  */
673
917
  overrides?: Partial<GlobalOverrides & ThreadOverrides & CommentOverrides & ComposerOverrides>;
918
+ /**
919
+ * Override the component's components.
920
+ */
921
+ components?: Partial<GlobalComponents>;
674
922
  }
675
923
  /**
676
924
  * Displays a thread of comments, with a composer to reply
@@ -685,7 +933,7 @@ interface ThreadProps<M extends BaseMetadata = DM> extends ComponentPropsWithout
685
933
  */
686
934
  declare const Thread: <M extends BaseMetadata = DM>(props: ThreadProps<M> & RefAttributes<HTMLDivElement>) => JSX.Element;
687
935
 
688
- type LiveblocksUIConfigProps = PropsWithChildren<{
936
+ type LiveblocksUiConfigProps = PropsWithChildren<{
689
937
  /**
690
938
  * Override the components' strings.
691
939
  */
@@ -729,11 +977,11 @@ type LiveblocksUIConfigProps = PropsWithChildren<{
729
977
  * Set configuration options for all components.
730
978
  *
731
979
  * @example
732
- * <LiveblocksUIConfig overrides={{ locale: "fr", USER_UNKNOWN: "Anonyme", ... }}>
980
+ * <LiveblocksUiConfig overrides={{ locale: "fr", USER_UNKNOWN: "Anonyme", ... }}>
733
981
  * <App />
734
- * </LiveblocksUIConfig>
982
+ * </LiveblocksUiConfig>
735
983
  */
736
- declare function LiveblocksUIConfig({ overrides, components, portalContainer, preventUnsavedComposerChanges, emojibaseUrl, children, }: LiveblocksUIConfigProps): react_jsx_runtime.JSX.Element;
984
+ declare function LiveblocksUiConfig({ overrides, components, portalContainer, preventUnsavedComposerChanges, emojibaseUrl, children, }: LiveblocksUiConfigProps): react_jsx_runtime.JSX.Element;
737
985
 
738
986
  declare function ArrowCornerDownRightIcon(props: ComponentProps<"svg">): react_jsx_runtime.JSX.Element;
739
987
 
@@ -875,4 +1123,4 @@ declare namespace icon {
875
1123
  };
876
1124
  }
877
1125
 
878
- export { AiChat, AiChatProps, AiToolDebugger, Comment, CommentAttachmentArgs, CommentOverrides, CommentProps, Composer, ComposerBodyMark, ComposerBodyMarks, ComposerOverrides, ComposerProps, ComposerSubmitComment, GlobalOverrides, HistoryVersionSummary, HistoryVersionSummaryList, HistoryVersionSummaryListProps, HistoryVersionSummaryProps, icon as Icon, InboxNotification, InboxNotificationAvatarProps, InboxNotificationCustomKindProps, InboxNotificationCustomProps, InboxNotificationIconProps, InboxNotificationList, InboxNotificationListProps, InboxNotificationOverrides, InboxNotificationProps, InboxNotificationTextMentionKindProps, InboxNotificationTextMentionProps, InboxNotificationThreadKindProps, InboxNotificationThreadProps, LiveblocksUIConfig, LocalizationOverrides, Overrides, Thread, ThreadOverrides, ThreadProps, useOverrides };
1126
+ export { AiChat, AiChatComponents, AiChatComponentsEmptyProps, AiChatComponentsLoadingProps, AiChatProps, AiTool, AiToolIconProps, AiToolProps, Comment, CommentAttachmentArgs, CommentOverrides, CommentProps, Composer, ComposerBodyMark, ComposerBodyMarks, ComposerOverrides, ComposerProps, ComposerSubmitComment, GlobalOverrides, HistoryVersionSummary, HistoryVersionSummaryList, HistoryVersionSummaryListProps, HistoryVersionSummaryProps, icon as Icon, InboxNotification, InboxNotificationAvatarProps, InboxNotificationCustomKindProps, InboxNotificationCustomProps, InboxNotificationIconProps, InboxNotificationList, InboxNotificationListProps, InboxNotificationOverrides, InboxNotificationProps, InboxNotificationTextMentionKindProps, InboxNotificationTextMentionProps, InboxNotificationThreadKindProps, InboxNotificationThreadProps, LiveblocksUiConfig, LocalizationOverrides, Overrides, Thread, ThreadOverrides, ThreadProps, useOverrides };