@xpert-ai/chatkit-ui 0.5.0 → 0.5.2

package/dist/index.cjs

@@ -372,6 +372,7 @@ var import_react2 = require("react");
 // src/providers/ParentMessenger.tsx
 var import_react = require("react");
 var import_chatkit_types4 = require("@xpert-ai/chatkit-types");
+var import_chatkit_web_shared = require("@xpert-ai/chatkit-web-shared");
 
 // src/hooks/useStream.ts
 var streamRef = { current: null };
@@ -844,6 +845,7 @@ var createNonce = () => {
 };
 var ParentMessengerContext = (0, import_react.createContext)(null);
 function ParentMessengerProvider({
+  channelId,
   children
 }) {
   const { streamRef: streamRef2 } = useStreamManager();
@@ -914,6 +916,7 @@ function ParentMessengerProvider({
     const sendResponse = (nonce, response, error) => {
       const message = {
         __xpaiChatKit: true,
+        ...channelId ? { channelId } : {},
         type: "response",
         nonce,
         response,
@@ -922,13 +925,14 @@ function ParentMessengerProvider({
       window.parent.postMessage(message, parentOriginRef.current);
     };
     const handleMessage = (event) => {
-      if (event.source !== window.parent) return;
-      if (!event.data || typeof event.data !== "object") return;
-      if (parentOriginRef.current !== "*" && typeof event.origin === "string" && event.origin !== parentOriginRef.current) {
+      if (!(0, import_chatkit_web_shared.isTrustedChatKitMessageEvent)(event, {
+        channelId,
+        expectedOrigin: parentOriginRef.current,
+        expectedSource: window.parent
+      })) {
         return;
       }
       const payload = event.data;
-      if (payload.__xpaiChatKit !== true) return;
       if (payload.type === "command" && payload.command === "onSendUserMessage") {
         const nonce = typeof payload.nonce === "string" ? payload.nonce : null;
         if (nonce) {
@@ -1120,7 +1124,7 @@ function ParentMessengerProvider({
       });
       pendingRef.current.clear();
     };
-  }, [isParentAvailable, streamRef2]);
+  }, [channelId, isParentAvailable, streamRef2]);
   const sendCommand = (0, import_react.useCallback)(
     (command, data, transfer) => {
       if (!isParentAvailable) {
@@ -1129,6 +1133,7 @@ function ParentMessengerProvider({
       const nonce = createNonce();
       const message = {
         __xpaiChatKit: true,
+        ...channelId ? { channelId } : {},
         type: "command",
         nonce,
         command,
@@ -1139,7 +1144,7 @@ function ParentMessengerProvider({
         window.parent.postMessage(message, parentOriginRef.current, transfer);
       });
     },
-    [isParentAvailable]
+    [channelId, isParentAvailable]
   );
   const sendEvent = (0, import_react.useCallback)(
     (event, data, transfer) => {
@@ -1156,13 +1161,14 @@ function ParentMessengerProvider({
       if (!isParentAvailable) return;
       const message = {
         __xpaiChatKit: true,
+        ...channelId ? { channelId } : {},
         type: "event",
         event,
         data
       };
       window.parent.postMessage(message, parentOriginRef.current, transfer);
     },
-    [isParentAvailable]
+    [channelId, isParentAvailable]
   );
   const value = (0, import_react.useMemo)(
     () => ({
@@ -12243,6 +12249,24 @@ function ToolStepIcon({
   React35.useEffect(() => {
     setFailedIconUrl(null);
   }, [iconUrl]);
+  if (data.icon) {
+    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+      IconDefinitionRenderer,
+      {
+        icon: data.icon,
+        className,
+        dataSlot: "tool-step-icon",
+        fallback: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+          import_lucide_react22.CircleHelp,
+          {
+            className,
+            "aria-hidden": "true",
+            "data-slot": "tool-step-icon"
+          }
+        )
+      }
+    );
+  }
   if (avatar) {
     return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
       ToolAvatarIcon,
@@ -14969,6 +14993,7 @@ function useThreads(limit = DEFAULT_LIMIT) {
     client,
     threadId,
     assistantId,
+    projectId,
     isReady,
     isLoading: isStreamLoading,
     error: streamError
@@ -14987,7 +15012,7 @@ function useThreads(limit = DEFAULT_LIMIT) {
     setError(null);
     try {
       const { items } = await client.conversations.search({
-        where: { xpertId: assistantId },
+        where: { xpertId: assistantId, ...projectId ? { projectId } : {} },
         limit,
         order: { updatedAt: "DESC" }
       });
@@ -14997,11 +15022,14 @@ function useThreads(limit = DEFAULT_LIMIT) {
     } finally {
       setIsLoading(false);
     }
-  }, [client, limit, assistantId]);
+  }, [client, limit, assistantId, projectId]);
   const createThread = React42.useCallback(
     async (input) => {
       setError(null);
-      const payload = {};
+      const payload = {
+        xpertId: assistantId,
+        ...projectId ? { projectId } : {}
+      };
       if (input?.recordId) payload.id = input.recordId;
       if (input?.threadId) payload.threadId = input.threadId;
       if (input?.title) payload.title = input.title;
@@ -15010,7 +15038,7 @@ function useThreads(limit = DEFAULT_LIMIT) {
       upsertThreadRecord(created);
       return created;
     },
-    [client, upsertThreadRecord]
+    [assistantId, client, projectId, upsertThreadRecord]
   );
   const updateThread = React42.useCallback(
     async (recordId, payload) => {
@@ -18487,6 +18515,7 @@ function Chat({
   );
   const attachmentsRef = React56.useRef(null);
   const composerInputRef = React56.useRef(null);
+  const isComposerComposingRef = React56.useRef(false);
   const slashPaletteRef = React56.useRef(null);
   const slashPaletteOptionRefs = React56.useRef(
     []
@@ -19287,12 +19316,17 @@ function Chat({
   );
   const handleComposerInput = React56.useCallback(
     (event) => {
+      if (isComposerComposingRef.current) return;
       syncComposerInputFromElement(event.currentTarget);
     },
     [syncComposerInputFromElement]
   );
+  const handleComposerCompositionStart = React56.useCallback(() => {
+    isComposerComposingRef.current = true;
+  }, []);
   const handleComposerCompositionEnd = React56.useCallback(
     (event) => {
+      isComposerComposingRef.current = false;
       syncComposerInputFromElement(event.currentTarget);
     },
     [syncComposerInputFromElement]
@@ -20853,6 +20887,7 @@ function Chat({
                               contentEditable: !(missingConfig || isHistoryLoading || hasPendingInteractiveRequest),
                               suppressContentEditableWarning: true,
                               onInput: handleComposerInput,
+                              onCompositionStart: handleComposerCompositionStart,
                               onCompositionEnd: handleComposerCompositionEnd,
                               onSelect: handleComposerSelect,
                               onPaste: handleComposerPaste,

package/dist/index.d.cts

@@ -178,9 +178,10 @@ type ParentMessenger = {
     sendEvent: <E extends ParentEventName>(event: E, data: ParentEventPayloadMap[E], transfer?: Transferable[]) => void;
 };
 type ParentMessengerProviderProps = {
+    channelId?: string;
     children: ReactNode;
 };
-declare function ParentMessengerProvider({ children, }: ParentMessengerProviderProps): react_jsx_runtime.JSX.Element;
+declare function ParentMessengerProvider({ channelId, children, }: ParentMessengerProviderProps): react_jsx_runtime.JSX.Element;
 
 type ParentMessengerOptions = {
     onSetOptions?: (options: ChatKitOptions | null) => void;

package/dist/index.d.ts

@@ -178,9 +178,10 @@ type ParentMessenger = {
     sendEvent: <E extends ParentEventName>(event: E, data: ParentEventPayloadMap[E], transfer?: Transferable[]) => void;
 };
 type ParentMessengerProviderProps = {
+    channelId?: string;
     children: ReactNode;
 };
-declare function ParentMessengerProvider({ children, }: ParentMessengerProviderProps): react_jsx_runtime.JSX.Element;
+declare function ParentMessengerProvider({ channelId, children, }: ParentMessengerProviderProps): react_jsx_runtime.JSX.Element;
 
 type ParentMessengerOptions = {
     onSetOptions?: (options: ChatKitOptions | null) => void;

package/dist/index.js

@@ -351,6 +351,9 @@ import {
 import {
   STATE_VARIABLE_HUMAN as STATE_VARIABLE_HUMAN2
 } from "@xpert-ai/chatkit-types";
+import {
+  isTrustedChatKitMessageEvent
+} from "@xpert-ai/chatkit-web-shared";
 
 // src/hooks/useStream.ts
 var streamRef = { current: null };
@@ -825,6 +828,7 @@ var createNonce = () => {
 };
 var ParentMessengerContext = createContext(null);
 function ParentMessengerProvider({
+  channelId,
   children
 }) {
   const { streamRef: streamRef2 } = useStreamManager();
@@ -895,6 +899,7 @@ function ParentMessengerProvider({
     const sendResponse = (nonce, response, error) => {
       const message = {
         __xpaiChatKit: true,
+        ...channelId ? { channelId } : {},
         type: "response",
         nonce,
         response,
@@ -903,13 +908,14 @@ function ParentMessengerProvider({
       window.parent.postMessage(message, parentOriginRef.current);
     };
     const handleMessage = (event) => {
-      if (event.source !== window.parent) return;
-      if (!event.data || typeof event.data !== "object") return;
-      if (parentOriginRef.current !== "*" && typeof event.origin === "string" && event.origin !== parentOriginRef.current) {
+      if (!isTrustedChatKitMessageEvent(event, {
+        channelId,
+        expectedOrigin: parentOriginRef.current,
+        expectedSource: window.parent
+      })) {
         return;
       }
       const payload = event.data;
-      if (payload.__xpaiChatKit !== true) return;
       if (payload.type === "command" && payload.command === "onSendUserMessage") {
         const nonce = typeof payload.nonce === "string" ? payload.nonce : null;
         if (nonce) {
@@ -1101,7 +1107,7 @@ function ParentMessengerProvider({
       });
       pendingRef.current.clear();
     };
-  }, [isParentAvailable, streamRef2]);
+  }, [channelId, isParentAvailable, streamRef2]);
   const sendCommand = useCallback(
     (command, data, transfer) => {
       if (!isParentAvailable) {
@@ -1110,6 +1116,7 @@ function ParentMessengerProvider({
       const nonce = createNonce();
       const message = {
         __xpaiChatKit: true,
+        ...channelId ? { channelId } : {},
         type: "command",
         nonce,
         command,
@@ -1120,7 +1127,7 @@ function ParentMessengerProvider({
         window.parent.postMessage(message, parentOriginRef.current, transfer);
       });
     },
-    [isParentAvailable]
+    [channelId, isParentAvailable]
   );
   const sendEvent = useCallback(
     (event, data, transfer) => {
@@ -1137,13 +1144,14 @@ function ParentMessengerProvider({
       if (!isParentAvailable) return;
       const message = {
         __xpaiChatKit: true,
+        ...channelId ? { channelId } : {},
         type: "event",
         event,
         data
       };
       window.parent.postMessage(message, parentOriginRef.current, transfer);
     },
-    [isParentAvailable]
+    [channelId, isParentAvailable]
   );
   const value = useMemo(
     () => ({
@@ -12348,6 +12356,24 @@ function ToolStepIcon({
   React35.useEffect(() => {
     setFailedIconUrl(null);
   }, [iconUrl]);
+  if (data.icon) {
+    return /* @__PURE__ */ jsx40(
+      IconDefinitionRenderer,
+      {
+        icon: data.icon,
+        className,
+        dataSlot: "tool-step-icon",
+        fallback: /* @__PURE__ */ jsx40(
+          CircleHelp,
+          {
+            className,
+            "aria-hidden": "true",
+            "data-slot": "tool-step-icon"
+          }
+        )
+      }
+    );
+  }
   if (avatar) {
     return /* @__PURE__ */ jsx40(
       ToolAvatarIcon,
@@ -15093,6 +15119,7 @@ function useThreads(limit = DEFAULT_LIMIT) {
     client,
     threadId,
     assistantId,
+    projectId,
     isReady,
     isLoading: isStreamLoading,
     error: streamError
@@ -15111,7 +15138,7 @@ function useThreads(limit = DEFAULT_LIMIT) {
     setError(null);
     try {
       const { items } = await client.conversations.search({
-        where: { xpertId: assistantId },
+        where: { xpertId: assistantId, ...projectId ? { projectId } : {} },
         limit,
         order: { updatedAt: "DESC" }
       });
@@ -15121,11 +15148,14 @@ function useThreads(limit = DEFAULT_LIMIT) {
     } finally {
       setIsLoading(false);
     }
-  }, [client, limit, assistantId]);
+  }, [client, limit, assistantId, projectId]);
   const createThread = React42.useCallback(
     async (input) => {
       setError(null);
-      const payload = {};
+      const payload = {
+        xpertId: assistantId,
+        ...projectId ? { projectId } : {}
+      };
       if (input?.recordId) payload.id = input.recordId;
       if (input?.threadId) payload.threadId = input.threadId;
       if (input?.title) payload.title = input.title;
@@ -15134,7 +15164,7 @@ function useThreads(limit = DEFAULT_LIMIT) {
       upsertThreadRecord(created);
       return created;
     },
-    [client, upsertThreadRecord]
+    [assistantId, client, projectId, upsertThreadRecord]
   );
   const updateThread = React42.useCallback(
     async (recordId, payload) => {
@@ -18636,6 +18666,7 @@ function Chat({
   );
   const attachmentsRef = React56.useRef(null);
   const composerInputRef = React56.useRef(null);
+  const isComposerComposingRef = React56.useRef(false);
   const slashPaletteRef = React56.useRef(null);
   const slashPaletteOptionRefs = React56.useRef(
     []
@@ -19436,12 +19467,17 @@ function Chat({
   );
   const handleComposerInput = React56.useCallback(
     (event) => {
+      if (isComposerComposingRef.current) return;
       syncComposerInputFromElement(event.currentTarget);
     },
     [syncComposerInputFromElement]
   );
+  const handleComposerCompositionStart = React56.useCallback(() => {
+    isComposerComposingRef.current = true;
+  }, []);
   const handleComposerCompositionEnd = React56.useCallback(
     (event) => {
+      isComposerComposingRef.current = false;
       syncComposerInputFromElement(event.currentTarget);
     },
     [syncComposerInputFromElement]
@@ -21002,6 +21038,7 @@ function Chat({
                               contentEditable: !(missingConfig || isHistoryLoading || hasPendingInteractiveRequest),
                               suppressContentEditableWarning: true,
                               onInput: handleComposerInput,
+                              onCompositionStart: handleComposerCompositionStart,
                               onCompositionEnd: handleComposerCompositionEnd,
                               onSelect: handleComposerSelect,
                               onPaste: handleComposerPaste,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xpert-ai/chatkit-ui",
-  "version": "0.5.0",
+  "version": "0.5.2",
   "description": "ChatKit UI.",
   "type": "module",
   "sideEffects": false,
@@ -60,8 +60,8 @@
     "uuid": "^11.1.0",
     "zod": "^4.1.12",
     "@xpert-ai/a2ui-react": "~0.1.0",
-    "@xpert-ai/chatkit-web-shared": "~0.4.2",
-    "@xpert-ai/chatkit-types": "~0.5.0"
+    "@xpert-ai/chatkit-web-shared": "~0.4.3",
+    "@xpert-ai/chatkit-types": "~0.5.1"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.9.1",

package/dist/app/assets/channel-DJ2gm0Ia.js

@@ -1 +0,0 @@
-import{aq as o,ar as n}from"./index-Dhjcgkd2.js";const t=(r,a)=>o.lang.round(n.parse(r)[a]);export{t as c};

package/dist/app/assets/classDiagram-6PBFFD2Q-DEiZ8yVf.js

@@ -1 +0,0 @@
-import{s as a,c as s,a as e,C as t}from"./chunk-4TB4RGXK-C3Jij7F2.js";import{_ as i}from"./index-Dhjcgkd2.js";import"./chunk-FMBD7UC4-DHemcwzb.js";import"./chunk-YZCP3GAM-CL5qbuJu.js";import"./chunk-55IACEB6-BQQm8tgd.js";import"./chunk-EDXVE4YY-CrgVQJaf.js";var u={parser:e,get db(){return new t},renderer:s,styles:a,init:i(r=>{r.class||(r.class={}),r.class.arrowMarkerAbsolute=r.arrowMarkerAbsolute},"init")};export{u as diagram};

package/dist/app/assets/classDiagram-v2-HSJHXN6E-DEiZ8yVf.js

@@ -1 +0,0 @@
-import{s as a,c as s,a as e,C as t}from"./chunk-4TB4RGXK-C3Jij7F2.js";import{_ as i}from"./index-Dhjcgkd2.js";import"./chunk-FMBD7UC4-DHemcwzb.js";import"./chunk-YZCP3GAM-CL5qbuJu.js";import"./chunk-55IACEB6-BQQm8tgd.js";import"./chunk-EDXVE4YY-CrgVQJaf.js";var u={parser:e,get db(){return new t},renderer:s,styles:a,init:i(r=>{r.class||(r.class={}),r.class.arrowMarkerAbsolute=r.arrowMarkerAbsolute},"init")};export{u as diagram};

package/dist/app/assets/clone-DHhyVjHM.js

@@ -1 +0,0 @@
-import{b as r}from"./graph-CI975tbR.js";var e=4;function a(o){return r(o,e)}export{a as c};

package/dist/app/assets/stateDiagram-v2-QKLJ7IA2-fPoLgwEW.js

@@ -1 +0,0 @@
-import{s as t,b as r,a,S as s}from"./chunk-OYMX7WX6-PvghOgZf.js";import{_ as i}from"./index-Dhjcgkd2.js";import"./chunk-55IACEB6-BQQm8tgd.js";import"./chunk-EDXVE4YY-CrgVQJaf.js";var l={parser:a,get db(){return new s(2)},renderer:r,styles:t,init:i(e=>{e.state||(e.state={}),e.state.arrowMarkerAbsolute=e.arrowMarkerAbsolute},"init")};export{l as diagram};