@copilotkit/react-core 1.56.4-canary.1777529757 → 1.56.4-canary.1777538870
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.
- package/dist/{copilotkit-DAatqMh2.mjs → copilotkit-Bd0m5HFp.mjs} +80 -97
- package/dist/copilotkit-Bd0m5HFp.mjs.map +1 -0
- package/dist/copilotkit-DFaI4j2r.d.mts.map +1 -1
- package/dist/copilotkit-Dg4r4Gi_.d.cts.map +1 -1
- package/dist/{copilotkit-BAkj3zUc.cjs → copilotkit-tb4zqaMK.cjs} +80 -97
- package/dist/copilotkit-tb4zqaMK.cjs.map +1 -0
- package/dist/index.cjs +1 -1
- package/dist/index.mjs +1 -1
- package/dist/v2/index.cjs +1 -1
- package/dist/v2/index.css +1 -1
- package/dist/v2/index.mjs +1 -1
- package/dist/v2/index.umd.js +82 -99
- package/dist/v2/index.umd.js.map +1 -1
- package/package.json +8 -8
- package/src/v2/components/chat/CopilotChatAttachmentQueue.tsx +113 -3
- package/src/v2/components/chat/CopilotChatAttachmentRenderer.tsx +6 -26
- package/src/v2/components/chat/CopilotChatUserMessage.tsx +2 -2
- package/src/v2/components/chat/CopilotChatView.tsx +13 -28
- package/src/v2/components/chat/__tests__/CopilotChatView.inputOverlay.test.tsx +0 -92
- package/dist/copilotkit-BAkj3zUc.cjs.map +0 -1
- package/dist/copilotkit-DAatqMh2.mjs.map +0 -1
- package/src/v2/components/chat/Lightbox.tsx +0 -103
- package/src/v2/components/chat/__tests__/CopilotChat.suggestionsAlways.test.tsx +0 -189
|
@@ -16,8 +16,8 @@ import { z } from "zod";
|
|
|
16
16
|
import { createComponent } from "@lit-labs/react";
|
|
17
17
|
import { A2UIProvider, A2UIRenderer, A2UI_SCHEMA_CONTEXT_DESCRIPTION, DEFAULT_SURFACE_ID, buildCatalogContextValue, extractCatalogComponentSchemas, initializeDefaultCatalog, injectStyles, useA2UIActions, useA2UIError, viewerTheme } from "@copilotkit/a2ui-renderer";
|
|
18
18
|
import { zodToJsonSchema } from "zod-to-json-schema";
|
|
19
|
-
import { createPortal, flushSync } from "react-dom";
|
|
20
19
|
import { useVirtualizer } from "@tanstack/react-virtual";
|
|
20
|
+
import { createPortal, flushSync } from "react-dom";
|
|
21
21
|
import { StickToBottom, useStickToBottomContext } from "use-stick-to-bottom";
|
|
22
22
|
import ReactMarkdown from "react-markdown";
|
|
23
23
|
|
|
@@ -5006,101 +5006,20 @@ CopilotChatAssistantMessage.ReadAloudButton.displayName = "CopilotChatAssistantM
|
|
|
5006
5006
|
CopilotChatAssistantMessage.RegenerateButton.displayName = "CopilotChatAssistantMessage.RegenerateButton";
|
|
5007
5007
|
var CopilotChatAssistantMessage_default = CopilotChatAssistantMessage;
|
|
5008
5008
|
|
|
5009
|
-
//#endregion
|
|
5010
|
-
//#region src/v2/components/chat/Lightbox.tsx
|
|
5011
|
-
function Lightbox({ onClose, children }) {
|
|
5012
|
-
useEffect(() => {
|
|
5013
|
-
const handleKey = (e) => {
|
|
5014
|
-
if (e.key === "Escape") onClose();
|
|
5015
|
-
};
|
|
5016
|
-
document.addEventListener("keydown", handleKey);
|
|
5017
|
-
return () => document.removeEventListener("keydown", handleKey);
|
|
5018
|
-
}, [onClose]);
|
|
5019
|
-
if (typeof document === "undefined") return null;
|
|
5020
|
-
return createPortal(/* @__PURE__ */ jsxs("div", {
|
|
5021
|
-
className: "cpk:fixed cpk:inset-0 cpk:z-[9999] cpk:flex cpk:items-center cpk:justify-center cpk:bg-black/80 cpk:animate-fade-in",
|
|
5022
|
-
onClick: onClose,
|
|
5023
|
-
children: [/* @__PURE__ */ jsx("button", {
|
|
5024
|
-
onClick: onClose,
|
|
5025
|
-
className: "cpk:absolute cpk:top-4 cpk:right-4 cpk:text-white cpk:bg-white/10 cpk:hover:bg-white/20 cpk:rounded-full cpk:w-10 cpk:h-10 cpk:flex cpk:items-center cpk:justify-center cpk:cursor-pointer cpk:border-none cpk:z-10",
|
|
5026
|
-
"aria-label": "Close preview",
|
|
5027
|
-
children: /* @__PURE__ */ jsx(X, { className: "cpk:w-5 cpk:h-5" })
|
|
5028
|
-
}), /* @__PURE__ */ jsx("div", {
|
|
5029
|
-
onClick: (e) => e.stopPropagation(),
|
|
5030
|
-
children
|
|
5031
|
-
})]
|
|
5032
|
-
}), document.body);
|
|
5033
|
-
}
|
|
5034
|
-
/**
|
|
5035
|
-
* Hook that manages lightbox open/close and uses the View Transition API to
|
|
5036
|
-
* morph the thumbnail into fullscreen content.
|
|
5037
|
-
*
|
|
5038
|
-
* The trick: `view-transition-name` must live on exactly ONE element at a time.
|
|
5039
|
-
* - Old state (thumbnail visible): name is on the thumbnail.
|
|
5040
|
-
* - New state (lightbox visible): name moves to the lightbox content.
|
|
5041
|
-
* `flushSync` ensures React commits the DOM change synchronously inside the
|
|
5042
|
-
* `startViewTransition` callback so the API can snapshot old → new correctly.
|
|
5043
|
-
*/
|
|
5044
|
-
function useLightbox() {
|
|
5045
|
-
const thumbnailRef = useRef(null);
|
|
5046
|
-
const [open, setOpen] = useState(false);
|
|
5047
|
-
const vtName = useId();
|
|
5048
|
-
return {
|
|
5049
|
-
thumbnailRef,
|
|
5050
|
-
vtName,
|
|
5051
|
-
open,
|
|
5052
|
-
openLightbox: useCallback(() => {
|
|
5053
|
-
const thumb = thumbnailRef.current;
|
|
5054
|
-
const doc = document;
|
|
5055
|
-
if (doc.startViewTransition && thumb) {
|
|
5056
|
-
thumb.style.viewTransitionName = vtName;
|
|
5057
|
-
doc.startViewTransition(() => {
|
|
5058
|
-
thumb.style.viewTransitionName = "";
|
|
5059
|
-
flushSync(() => setOpen(true));
|
|
5060
|
-
});
|
|
5061
|
-
} else setOpen(true);
|
|
5062
|
-
}, [vtName]),
|
|
5063
|
-
closeLightbox: useCallback(() => {
|
|
5064
|
-
const thumb = thumbnailRef.current;
|
|
5065
|
-
const doc = document;
|
|
5066
|
-
if (doc.startViewTransition && thumb) doc.startViewTransition(() => {
|
|
5067
|
-
flushSync(() => setOpen(false));
|
|
5068
|
-
thumb.style.viewTransitionName = vtName;
|
|
5069
|
-
}).finished.then(() => {
|
|
5070
|
-
thumb.style.viewTransitionName = "";
|
|
5071
|
-
}).catch(() => {
|
|
5072
|
-
thumb.style.viewTransitionName = "";
|
|
5073
|
-
});
|
|
5074
|
-
else setOpen(false);
|
|
5075
|
-
}, [vtName])
|
|
5076
|
-
};
|
|
5077
|
-
}
|
|
5078
|
-
|
|
5079
5009
|
//#endregion
|
|
5080
5010
|
//#region src/v2/components/chat/CopilotChatAttachmentRenderer.tsx
|
|
5081
5011
|
const ImageAttachment = memo(function ImageAttachment({ src, className }) {
|
|
5082
5012
|
const [error, setError] = useState(false);
|
|
5083
|
-
const { thumbnailRef, vtName, open, openLightbox, closeLightbox } = useLightbox();
|
|
5084
5013
|
if (error) return /* @__PURE__ */ jsx("div", {
|
|
5085
5014
|
className: cn("cpk:flex cpk:flex-col cpk:items-center cpk:justify-center cpk:rounded-lg cpk:bg-muted cpk:p-4 cpk:text-sm cpk:text-muted-foreground", className),
|
|
5086
5015
|
children: /* @__PURE__ */ jsx("span", { children: "Failed to load image" })
|
|
5087
5016
|
});
|
|
5088
|
-
return /* @__PURE__ */
|
|
5089
|
-
ref: thumbnailRef,
|
|
5017
|
+
return /* @__PURE__ */ jsx("img", {
|
|
5090
5018
|
src,
|
|
5091
5019
|
alt: "Image attachment",
|
|
5092
|
-
className: cn("cpk:max-w-
|
|
5093
|
-
onClick: openLightbox,
|
|
5020
|
+
className: cn("cpk:max-w-full cpk:h-auto cpk:rounded-lg", className),
|
|
5094
5021
|
onError: () => setError(true)
|
|
5095
|
-
})
|
|
5096
|
-
onClose: closeLightbox,
|
|
5097
|
-
children: /* @__PURE__ */ jsx("img", {
|
|
5098
|
-
style: { viewTransitionName: vtName },
|
|
5099
|
-
src,
|
|
5100
|
-
alt: "Image attachment",
|
|
5101
|
-
className: "cpk:max-w-[90vw] cpk:max-h-[90vh] cpk:object-contain cpk:rounded-lg"
|
|
5102
|
-
})
|
|
5103
|
-
})] });
|
|
5022
|
+
});
|
|
5104
5023
|
});
|
|
5105
5024
|
const AudioAttachment = memo(function AudioAttachment({ src, filename, className }) {
|
|
5106
5025
|
return /* @__PURE__ */ jsxs("div", {
|
|
@@ -5225,15 +5144,15 @@ function CopilotChatUserMessage({ message, onEditMessage, branchIndex, numberOfB
|
|
|
5225
5144
|
"data-message-id": message.id,
|
|
5226
5145
|
...props,
|
|
5227
5146
|
children: [
|
|
5147
|
+
BoundMessageRenderer,
|
|
5228
5148
|
mediaParts.length > 0 && /* @__PURE__ */ jsx("div", {
|
|
5229
|
-
className: "cpk:flex cpk:flex-
|
|
5149
|
+
className: "cpk:flex cpk:flex-col cpk:items-end cpk:gap-2 cpk:mt-2",
|
|
5230
5150
|
children: mediaParts.map((part, index) => /* @__PURE__ */ jsx(CopilotChatAttachmentRenderer, {
|
|
5231
5151
|
type: part.type,
|
|
5232
5152
|
source: part.source,
|
|
5233
5153
|
filename: getFilename(part)
|
|
5234
5154
|
}, index))
|
|
5235
5155
|
}),
|
|
5236
|
-
BoundMessageRenderer,
|
|
5237
5156
|
BoundToolbar
|
|
5238
5157
|
]
|
|
5239
5158
|
});
|
|
@@ -5937,6 +5856,73 @@ function AttachmentPreview({ attachment }) {
|
|
|
5937
5856
|
case "document": return /* @__PURE__ */ jsx(DocumentPreview, { attachment });
|
|
5938
5857
|
}
|
|
5939
5858
|
}
|
|
5859
|
+
function Lightbox({ onClose, children }) {
|
|
5860
|
+
useEffect(() => {
|
|
5861
|
+
const handleKey = (e) => {
|
|
5862
|
+
if (e.key === "Escape") onClose();
|
|
5863
|
+
};
|
|
5864
|
+
document.addEventListener("keydown", handleKey);
|
|
5865
|
+
return () => document.removeEventListener("keydown", handleKey);
|
|
5866
|
+
}, [onClose]);
|
|
5867
|
+
if (typeof document === "undefined") return null;
|
|
5868
|
+
return createPortal(/* @__PURE__ */ jsxs("div", {
|
|
5869
|
+
className: "cpk:fixed cpk:inset-0 cpk:z-[9999] cpk:flex cpk:items-center cpk:justify-center cpk:bg-black/80 cpk:animate-fade-in",
|
|
5870
|
+
onClick: onClose,
|
|
5871
|
+
children: [/* @__PURE__ */ jsx("button", {
|
|
5872
|
+
onClick: onClose,
|
|
5873
|
+
className: "cpk:absolute cpk:top-4 cpk:right-4 cpk:text-white cpk:bg-white/10 cpk:hover:bg-white/20 cpk:rounded-full cpk:w-10 cpk:h-10 cpk:flex cpk:items-center cpk:justify-center cpk:cursor-pointer cpk:border-none cpk:z-10",
|
|
5874
|
+
"aria-label": "Close preview",
|
|
5875
|
+
children: /* @__PURE__ */ jsx(X, { className: "cpk:w-5 cpk:h-5" })
|
|
5876
|
+
}), /* @__PURE__ */ jsx("div", {
|
|
5877
|
+
onClick: (e) => e.stopPropagation(),
|
|
5878
|
+
children
|
|
5879
|
+
})]
|
|
5880
|
+
}), document.body);
|
|
5881
|
+
}
|
|
5882
|
+
/**
|
|
5883
|
+
* Hook that manages lightbox open/close and uses the View Transition API to
|
|
5884
|
+
* morph the thumbnail into fullscreen content.
|
|
5885
|
+
*
|
|
5886
|
+
* The trick: `view-transition-name` must live on exactly ONE element at a time.
|
|
5887
|
+
* - Old state (thumbnail visible): name is on the thumbnail.
|
|
5888
|
+
* - New state (lightbox visible): name moves to the lightbox content.
|
|
5889
|
+
* `flushSync` ensures React commits the DOM change synchronously inside the
|
|
5890
|
+
* `startViewTransition` callback so the API can snapshot old → new correctly.
|
|
5891
|
+
*/
|
|
5892
|
+
function useLightbox() {
|
|
5893
|
+
const thumbnailRef = useRef(null);
|
|
5894
|
+
const [open, setOpen] = useState(false);
|
|
5895
|
+
const vtName = useId();
|
|
5896
|
+
return {
|
|
5897
|
+
thumbnailRef,
|
|
5898
|
+
vtName,
|
|
5899
|
+
open,
|
|
5900
|
+
openLightbox: useCallback(() => {
|
|
5901
|
+
const thumb = thumbnailRef.current;
|
|
5902
|
+
const doc = document;
|
|
5903
|
+
if (doc.startViewTransition && thumb) {
|
|
5904
|
+
thumb.style.viewTransitionName = vtName;
|
|
5905
|
+
doc.startViewTransition(() => {
|
|
5906
|
+
thumb.style.viewTransitionName = "";
|
|
5907
|
+
flushSync(() => setOpen(true));
|
|
5908
|
+
});
|
|
5909
|
+
} else setOpen(true);
|
|
5910
|
+
}, []),
|
|
5911
|
+
closeLightbox: useCallback(() => {
|
|
5912
|
+
const thumb = thumbnailRef.current;
|
|
5913
|
+
const doc = document;
|
|
5914
|
+
if (doc.startViewTransition && thumb) doc.startViewTransition(() => {
|
|
5915
|
+
flushSync(() => setOpen(false));
|
|
5916
|
+
thumb.style.viewTransitionName = vtName;
|
|
5917
|
+
}).finished.then(() => {
|
|
5918
|
+
thumb.style.viewTransitionName = "";
|
|
5919
|
+
}).catch(() => {
|
|
5920
|
+
thumb.style.viewTransitionName = "";
|
|
5921
|
+
});
|
|
5922
|
+
else setOpen(false);
|
|
5923
|
+
}, [])
|
|
5924
|
+
};
|
|
5925
|
+
}
|
|
5940
5926
|
function ImagePreview({ attachment }) {
|
|
5941
5927
|
const src = getSourceUrl(attachment.source);
|
|
5942
5928
|
const { thumbnailRef, vtName, open, openLightbox, closeLightbox } = useLightbox();
|
|
@@ -6276,17 +6262,14 @@ function DropOverlay() {
|
|
|
6276
6262
|
});
|
|
6277
6263
|
}
|
|
6278
6264
|
function CopilotChatView({ messageView, input, scrollView, suggestionView, welcomeScreen, messages = [], autoScroll = true, isRunning = false, suggestions, suggestionLoadingIndexes, onSelectSuggestion, onSubmitMessage, onStop, inputMode, inputValue, onInputChange, onStartTranscribe, onCancelTranscribe, onFinishTranscribe, onFinishTranscribeWithAudio, attachments, onRemoveAttachment, onAddFile, dragOver, onDragOver, onDragLeave, onDrop, isConnecting = false, hasExplicitThreadId = false, disclaimer, children, className, ...props }) {
|
|
6279
|
-
const
|
|
6265
|
+
const inputContainerRef = useRef(null);
|
|
6280
6266
|
const [inputContainerHeight, setInputContainerHeight] = useState(0);
|
|
6281
6267
|
const [isResizing, setIsResizing] = useState(false);
|
|
6282
6268
|
const resizeTimeoutRef = useRef(null);
|
|
6283
6269
|
const { isKeyboardOpen, keyboardHeight, availableHeight } = useKeyboardHeight();
|
|
6284
6270
|
useEffect(() => {
|
|
6285
|
-
const element =
|
|
6286
|
-
if (!element)
|
|
6287
|
-
setInputContainerHeight(0);
|
|
6288
|
-
return;
|
|
6289
|
-
}
|
|
6271
|
+
const element = inputContainerRef.current;
|
|
6272
|
+
if (!element) return;
|
|
6290
6273
|
const resizeObserver = new ResizeObserver((entries) => {
|
|
6291
6274
|
for (const entry of entries) {
|
|
6292
6275
|
const newHeight = entry.contentRect.height;
|
|
@@ -6309,7 +6292,7 @@ function CopilotChatView({ messageView, input, scrollView, suggestionView, welco
|
|
|
6309
6292
|
resizeObserver.disconnect();
|
|
6310
6293
|
if (resizeTimeoutRef.current) clearTimeout(resizeTimeoutRef.current);
|
|
6311
6294
|
};
|
|
6312
|
-
}, [
|
|
6295
|
+
}, []);
|
|
6313
6296
|
const BoundMessageView = renderSlot(messageView, CopilotChatMessageView, {
|
|
6314
6297
|
messages,
|
|
6315
6298
|
isRunning
|
|
@@ -6332,7 +6315,7 @@ function CopilotChatView({ messageView, input, scrollView, suggestionView, welco
|
|
|
6332
6315
|
bottomAnchored: true,
|
|
6333
6316
|
...disclaimer !== void 0 ? { disclaimer } : {}
|
|
6334
6317
|
});
|
|
6335
|
-
const hasSuggestions = !isConnecting && Array.isArray(suggestions) && suggestions.length > 0;
|
|
6318
|
+
const hasSuggestions = !isConnecting && !isRunning && Array.isArray(suggestions) && suggestions.length > 0;
|
|
6336
6319
|
const BoundSuggestionView = hasSuggestions ? renderSlot(suggestionView, CopilotChatSuggestionView, {
|
|
6337
6320
|
suggestions,
|
|
6338
6321
|
loadingIndexes: suggestionLoadingIndexes,
|
|
@@ -6420,7 +6403,7 @@ function CopilotChatView({ messageView, input, scrollView, suggestionView, welco
|
|
|
6420
6403
|
dragOver && /* @__PURE__ */ jsx(DropOverlay, {}),
|
|
6421
6404
|
BoundScrollView,
|
|
6422
6405
|
/* @__PURE__ */ jsxs("div", {
|
|
6423
|
-
ref:
|
|
6406
|
+
ref: inputContainerRef,
|
|
6424
6407
|
"data-testid": "copilot-input-overlay",
|
|
6425
6408
|
className: "cpk:absolute cpk:bottom-0 cpk:left-0 cpk:right-0 cpk:z-20 cpk:pointer-events-none",
|
|
6426
6409
|
children: [attachments && attachments.length > 0 && /* @__PURE__ */ jsx("div", {
|
|
@@ -9770,4 +9753,4 @@ function validateProps(props) {
|
|
|
9770
9753
|
|
|
9771
9754
|
//#endregion
|
|
9772
9755
|
export { CopilotKitProvider as $, CopilotChatSuggestionView as A, useConfigureSuggestions as B, CopilotChatToggleButton as C, CopilotChatView_default as D, CopilotChat as E, CopilotChatAssistantMessage_default as F, useRenderTool as G, useCapabilities as H, CopilotChatToolCallsView as I, useRenderActivityMessage as J, useComponent as K, useAttachments as L, CopilotChatReasoningMessage_default as M, CopilotChatUserMessage_default as N, CopilotChatAttachmentQueue as O, CopilotChatAttachmentRenderer as P, useRenderToolCall as Q, useThreads$1 as R, CopilotModalHeader as S, DefaultOpenIcon as T, useHumanInTheLoop as U, useSuggestions as V, useDefaultRenderTool as W, UseAgentUpdate as X, useRenderCustomMessages as Y, useAgent as Z, WildcardToolCallRender as _, ThreadsProvider as a, SandboxFunctionsContext as at, CopilotPopupView as b, CoAgentStateRendersProvider as c, MCPAppsActivityRenderer as ct, shouldShowDevConsole as d, CopilotChatInput_default as dt, useCopilotKit as et, useToast as f, AudioRecorderError as ft, useCopilotContext as g, CopilotContext as h, useCopilotChatConfiguration as ht, ThreadsContext as i, createA2UIMessageRenderer as it, CopilotChatSuggestionPill as j, CopilotChatMessageView as k, useCoAgentStateRenders as l, MCPAppsActivityType as lt, useCopilotMessagesContext as m, CopilotChatConfigurationProvider as mt, defaultCopilotContextCategories as n, useAgentContext as nt, useThreads as o, useSandboxFunctions as ot, CopilotMessagesContext as p, CopilotChatAudioRecorder as pt, useFrontendTool as q, CoAgentStateRenderBridge as r, defineToolCallRenderer as rt, CoAgentStateRendersContext as s, MCPAppsActivityContentSchema as st, CopilotKit as t, CopilotKitCoreReact as tt, useAsyncCallback as u, CopilotKitInspector as ut, CopilotPopup as v, DefaultCloseIcon as w, CopilotSidebarView as x, CopilotSidebar as y, useInterrupt as z };
|
|
9773
|
-
//# sourceMappingURL=copilotkit-
|
|
9756
|
+
//# sourceMappingURL=copilotkit-Bd0m5HFp.mjs.map
|