ikoncomponents 1.6.8 → 1.7.0

package/dist/utils/api/file-upload copy/index.d.ts

@@ -0,0 +1,13 @@
+export declare const uploadFilePublic: (file: File) => Promise<any>;
+export declare const fetchImagePreview: (resourceId: string) => Promise<string>;
+export declare const fileUpload: (fileObjArray: Array<{
+    fileName: string;
+    type: string;
+    base64: string;
+}>) => Promise<any>;
+export declare const downloadFileByResourceId: (resourceId: string) => Promise<void>;
+export declare const fetchFileAsBase64: (resourceId: string) => Promise<{
+    base64: string;
+    fileSize: number;
+    fileType: string;
+}>;

package/dist/utils/api/file-upload copy/index.js

@@ -0,0 +1,120 @@
+import { getValidAccessToken } from "@/utils/token-management";
+const IKON_BASE_API_URL = "https://ikoncloud-dev.keross.com/ikon-api";
+export const uploadFilePublic = async (file) => {
+    const accessToken = await getValidAccessToken(IKON_BASE_API_URL || "");
+    const formData = new FormData();
+    formData.append("file", file);
+    const response = await fetch(`${IKON_BASE_API_URL}/platform/file-resource/upload/public`, {
+        method: "POST",
+        headers: Object.assign({}, (accessToken ? { Authorization: `Bearer ${accessToken}` } : {})),
+        body: formData,
+    });
+    if (!response.ok) {
+        const errorText = await response.text();
+        throw new Error(`Upload failed: ${errorText}`);
+    }
+    const data = await response.json();
+    if (data.files && data.files.length > 0) {
+        //just return the 1st resourceId
+        return data;
+    }
+    throw new Error("No files returned from upload");
+};
+export const fetchImagePreview = async (resourceId) => {
+    const accessToken = await getValidAccessToken(IKON_BASE_API_URL || "");
+    const response = await fetch(`${IKON_BASE_API_URL}/platform/file-resource/download/public/${resourceId}`, {
+        method: "GET",
+        headers: {
+            "Authorization": `Bearer ${accessToken}`
+        }
+    });
+    if (!response.ok)
+        throw new Error("Failed to load image");
+    // Convert binary response to a temporary URL
+    const imageBlob = await response.blob();
+    return URL.createObjectURL(imageBlob);
+};
+export const fileUpload = async (fileObjArray) => {
+    try {
+        const accessToken = await getValidAccessToken(process.env.IKON_API_URL || "");
+        console.log("Uploading files:", fileObjArray);
+        const response = await fetch(`${process.env.SALES_CRM_API_URL}/api/upload-base64`, {
+            method: "POST",
+            headers: Object.assign({ "Content-Type": "application/json" }, (accessToken ? { Authorization: `Bearer ${accessToken}` } : {})),
+            body: JSON.stringify({ files: fileObjArray }), // send array
+        });
+        if (!response.ok) {
+            const errorText = await response.text();
+            throw new Error(`Upload failed: ${errorText}`);
+        }
+        const data = await response.json();
+        console.log("Server response:", data);
+        return data;
+    }
+    catch (err) {
+        console.error("File upload error:", err);
+        throw err;
+    }
+};
+export const downloadFileByResourceId = async (resourceId) => {
+    const accessToken = await getValidAccessToken(IKON_BASE_API_URL || "");
+    const response = await fetch(`${IKON_BASE_API_URL}/platform/file-resource/download/public/${resourceId}`, {
+        method: "GET",
+        headers: Object.assign({}, (accessToken ? { Authorization: `Bearer ${accessToken}` } : {})),
+    });
+    if (!response.ok) {
+        throw new Error("Failed to download file");
+    }
+    const blob = await response.blob();
+    const contentDisposition = response.headers.get("Content-Disposition");
+    let fileName = "downloaded-file";
+    if (contentDisposition) {
+        const match = contentDisposition.match(/filename="(.+)"/);
+        if (match)
+            fileName = match[1];
+    }
+    const url = window.URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = fileName;
+    document.body.appendChild(a);
+    a.click();
+    // cleanup
+    a.remove();
+    window.URL.revokeObjectURL(url);
+};
+export const fetchFileAsBase64 = async (resourceId) => {
+    const accessToken = await getValidAccessToken(IKON_BASE_API_URL || "");
+    const response = await fetch(`${IKON_BASE_API_URL}/platform/file-resource/download/public/${resourceId}`, {
+        method: "GET",
+        headers: Object.assign({}, (accessToken ? { Authorization: `Bearer ${accessToken}` } : {})),
+    });
+    if (!response.ok) {
+        throw new Error("Failed to fetch file");
+    }
+    const blob = await response.blob();
+    // ✅ Convert blob → base64
+    const base64 = await new Promise((resolve, reject) => {
+        const reader = new FileReader();
+        reader.onloadend = () => {
+            const result = reader.result;
+            const base64String = result.split(",")[1]; // remove data:*/*;base64,
+            resolve(base64String);
+        };
+        reader.onerror = reject;
+        reader.readAsDataURL(blob);
+    });
+    // ✅ Extract filename (if available)
+    const contentDisposition = response.headers.get("Content-Disposition");
+    let fileName = "unknown";
+    if (contentDisposition) {
+        const match = contentDisposition.match(/filename="(.+)"/);
+        if (match)
+            fileName = match[1];
+    }
+    return {
+        base64,
+        fileSize: blob.size,
+        fileType: blob.type,
+    };
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ikoncomponents",
-  "version": "1.6.8",
+  "version": "1.7.0",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "css": "dist/styles.css",
@@ -74,6 +74,7 @@
     "tailwind-merge": "^3.3.1",
     "tailwindcss-animate": "^1.0.7",
     "tap": "^21.5.0",
+    "use-debounce": "^10.1.1",
     "uuid": "^13.0.0",
     "vaul": "^1.1.2",
     "zod": "^4.3.6",

package/dist/ikoncomponents/assistant-ui/Assistant.d.ts

@@ -1,28 +0,0 @@
-interface UserData {
-    userId: string;
-    userName: string;
-    userLogin: string;
-    password: string;
-    userPhone?: string;
-    userEmail: string;
-    userThumbnail?: string | null;
-    userType?: string;
-    active?: boolean;
-    accountId?: string;
-    userDeleted?: boolean;
-}
-interface AssistantComponentProps {
-    provider?: string;
-    model?: string;
-    agentId?: string;
-    agentName?: string;
-    temperature?: number;
-    maxTokens?: number;
-    className?: string;
-    baseUrl?: string;
-    additionalReferenceInfo?: object;
-    appId: string;
-    currentUserDetails: UserData;
-}
-export declare const AssistantComponent: ({ provider, model, agentId, agentName, temperature, maxTokens, className, baseUrl, additionalReferenceInfo, appId, currentUserDetails, }: AssistantComponentProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/ikoncomponents/assistant-ui/Assistant.js

@@ -1,306 +0,0 @@
-// "use client";
-// import { Thread } from "./thread";
-// import { AssistantRuntimeProvider } from "@assistant-ui/react";
-// import { useChatRuntime } from "@assistant-ui/react-ai-sdk";
-// import { AgentTextChatTransport } from "./agentTextChatTransport";
-// import { useEffect, useState } from "react";
-// import { getValidAccessToken } from "@/utils/token-management";
-// import { Agent } from "./agent-dropdown";
-// interface UserData {
-//   userId: string;
-//   userName: string;
-//   userLogin: string;
-//   password: string;
-//   userPhone?: string;
-//   userEmail: string;
-//   userThumbnail?: string | null;
-//   userType?: string;
-//   active?: boolean;
-//   accountId?: string;
-//   userDeleted?: boolean;
-// }
-// interface AssistantComponentProps {
-//   provider?: string;
-//   model?: string;
-//   agentId?: string;
-//   agentName?: string;
-//   temperature?: number;
-//   maxTokens?: number;
-//   className?: string;
-//   baseUrl?: string;
-//   additionalReferenceInfo?: object;
-//   appId: string;
-//   currentUserDetails: UserData;
-// }
-// export const AssistantComponent = ({
-//   provider = "openai",
-//   model = "gpt-4o-mini",
-//   agentId = "default-agent",
-//   agentName = "Default Agent",
-//   temperature = 0.7,
-//   maxTokens = 2048,
-//   className,
-//   baseUrl = "http://localhost:3000",
-//   additionalReferenceInfo = {},
-//   appId = "",
-//   currentUserDetails,
-// }: AssistantComponentProps) => {
-//   const runtime = useChatRuntime({
-//     transport: new AgentTextChatTransport({
-//       provider,
-//       model,
-//       agentId,
-//       agentName,
-//       temperature,
-//       maxTokens,
-//       baseUrl,
-//       additionalReferenceInfo,
-//     }),
-//   });
-//   const [agentList, setAgentList] = useState([]);
-//   const [selectedAgent, setSelectedAgent] = useState<Agent>();
-//   const getAgentsByAppId = async () => {
-//     try {
-//       const accessToken = await getValidAccessToken(
-//         "https://ikoncloud-dev.keross.com/ikon-api",
-//       );
-//       const response = await fetch(`${baseUrl}/api/agent/${appId}`, {
-//         method: "GET",
-//         headers: {
-//           "Content-Type": "application/json",
-//           Authorization: `Bearer ${accessToken}`,
-//         },
-//       });
-//       // 1. Check if the response is actually okay
-//       if (!response.ok) {
-//         throw new Error(`HTTP error! status: ${response.status}`);
-//       }
-//       // 2. Parse the body as JSON
-//       const data = await response.json();
-//       // 3. Now you can use it!
-//       console.log("Agent Data:", data);
-//       setAgentList(data);
-//       // setAgentList(response)
-//     } catch (error) {
-//       console.error(
-//         "Error while fetching agents with the specific appId",
-//         error,
-//       );
-//     }
-//   };
-//   useEffect(() => {
-//     getAgentsByAppId();
-//   }, [appId, baseUrl]);
-//   useEffect(() => {
-//   },[selectedAgent])
-//   return (
-//     <AssistantRuntimeProvider runtime={runtime}>
-//       <div className={className}>
-//         <div
-//           className={`flex flex-col h-full border rounded-lg overflow-hidden ${className}`}
-//         >
-//           <Thread
-//             currentUserDetails={currentUserDetails}
-//             agents={agentList}
-//             initialAgentId={agentId}
-//             initialAgentName={agentName}
-//             onAgentChange={(agent) => {
-//               // Handle agent change here
-//               console.log("Agent changed:", agent);
-//               setSelectedAgent(agent);
-//             }}
-//           />
-//         </div>
-//       </div>
-//     </AssistantRuntimeProvider>
-//   );
-// };
-//2nd imperfect change
-// "use client";
-// import { Thread } from "./thread";
-// import { AssistantRuntimeProvider } from "@assistant-ui/react";
-// import { useChatRuntime } from "@assistant-ui/react-ai-sdk";
-// import { AgentTextChatTransport } from "./agentTextChatTransport";
-// import { useEffect, useRef, useState } from "react";
-// import { getValidAccessToken } from "@/utils/token-management";
-// import { Agent } from "./agent-dropdown";
-// interface UserData {
-//   userId: string;
-//   userName: string;
-//   userLogin: string;
-//   password: string;
-//   userPhone?: string;
-//   userEmail: string;
-//   userThumbnail?: string | null;
-//   userType?: string;
-//   active?: boolean;
-//   accountId?: string;
-//   userDeleted?: boolean;
-// }
-// interface AssistantComponentProps {
-//   provider?: string;
-//   model?: string;
-//   agentId?: string;
-//   agentName?: string;
-//   temperature?: number;
-//   maxTokens?: number;
-//   className?: string;
-//   baseUrl?: string;
-//   additionalReferenceInfo?: object;
-//   appId: string;
-//   currentUserDetails: UserData;
-// }
-// export const AssistantComponent = ({
-//   provider = "openai",
-//   model = "gpt-4o-mini",
-//   agentId = "default-agent",
-//   agentName = "Default Agent",
-//   temperature = 0.7,
-//   maxTokens = 2048,
-//   className,
-//   baseUrl = "http://localhost:3000",
-//   additionalReferenceInfo = {},
-//   appId = "",
-//   currentUserDetails,
-// }: AssistantComponentProps) => {
-//   const transportRef = useRef<AgentTextChatTransport | null>(null);
-//   const transport = new AgentTextChatTransport({
-//     provider,
-//     model,
-//     agentId,
-//     agentName,
-//     temperature,
-//     maxTokens,
-//     baseUrl,
-//     additionalReferenceInfo,
-//   });
-//   transportRef.current = transport;
-//   const runtime = useChatRuntime({
-//     transport,
-//   });
-//   const [agentList, setAgentList] = useState<Agent[]>([]);
-//   const [selectedAgent, setSelectedAgent] = useState<Agent>();
-//   const getAgentsByAppId = async () => {
-//     try {
-//       const accessToken = await getValidAccessToken(
-//         "https://ikoncloud-dev.keross.com/ikon-api",
-//       );
-//       const response = await fetch(`${baseUrl}/api/agent/${appId}`, {
-//         method: "GET",
-//         headers: {
-//           "Content-Type": "application/json",
-//           Authorization: `Bearer ${accessToken}`,
-//         },
-//       });
-//       if (!response.ok) {
-//         throw new Error(`HTTP error! status: ${response.status}`);
-//       }
-//       const data = await response.json();
-//       console.log("Agent Data:", data);
-//       setAgentList(data);
-//     } catch (error) {
-//       console.error(
-//         "Error while fetching agents with the specific appId",
-//         error,
-//       );
-//     }
-//   };
-//   useEffect(() => {
-//     getAgentsByAppId();
-//   }, [appId, baseUrl]);
-//   const handleAgentChange = (agent: Agent) => {
-//     setSelectedAgent(agent);
-//     // Update the transport with the new agent configuration
-//     if (transportRef.current) {
-//       transportRef.current.updateAgentConfig({
-//         agentId: agent.agentID,
-//         agentName: agent.agentName,
-//       });
-//     }
-//     console.log("Agent changed to:", agent.agentName);
-//   };
-//   return (
-//     <AssistantRuntimeProvider runtime={runtime}>
-//       <div className={className}>
-//         <div
-//           className={`flex flex-col h-full border rounded-lg overflow-hidden ${className}`}
-//         >
-//           <Thread
-//             currentUserDetails={currentUserDetails}
-//             agents={agentList}
-//             initialAgentId={agentId}
-//             initialAgentName={agentName}
-//             onAgentChange={handleAgentChange}
-//           />
-//         </div>
-//       </div>
-//     </AssistantRuntimeProvider>
-//   );
-// };
-//3rd change
-"use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Thread } from "./thread";
-import { AssistantRuntimeProvider } from "@assistant-ui/react";
-import { useChatRuntime } from "@assistant-ui/react-ai-sdk";
-import { AgentTextChatTransport } from "./agentTextChatTransport";
-import { useEffect, useMemo, useState } from "react";
-import { getValidAccessToken } from "../../utils/token-management";
-export const AssistantComponent = ({ provider = "openai", model = "gpt-4o-mini", agentId = "default-agent", agentName = "Default Agent", temperature = 0.7, maxTokens = 2048, className, baseUrl = "http://localhost:3000", additionalReferenceInfo = {}, appId = "", currentUserDetails, }) => {
-    const [agentList, setAgentList] = useState([]);
-    const [selectedAgent, setSelectedAgent] = useState();
-    // Create transport with current agent config - memoized to avoid recreating on every render
-    const transport = useMemo(() => new AgentTextChatTransport({
-        provider,
-        model,
-        agentId: selectedAgent ? selectedAgent.agentID : agentId,
-        agentName: selectedAgent ? selectedAgent.agentName : agentName,
-        temperature,
-        maxTokens,
-        baseUrl,
-        additionalReferenceInfo,
-    }), [
-        provider,
-        model,
-        selectedAgent,
-        agentId,
-        agentName,
-        temperature,
-        maxTokens,
-        baseUrl,
-        additionalReferenceInfo,
-    ]);
-    // Create runtime with the transport - will recreate when transport changes
-    const runtime = useChatRuntime({
-        transport,
-    });
-    const getAgentsByAppId = async () => {
-        try {
-            const accessToken = await getValidAccessToken("https://ikoncloud-dev.keross.com/ikon-api");
-            const response = await fetch(`${baseUrl}/api/agent/${appId}`, {
-                method: "GET",
-                headers: {
-                    "Content-Type": "application/json",
-                    Authorization: `Bearer ${accessToken}`,
-                },
-            });
-            if (!response.ok) {
-                throw new Error(`HTTP error! status: ${response.status}`);
-            }
-            const data = await response.json();
-            console.log("Agent Data:", data);
-            setAgentList(data);
-        }
-        catch (error) {
-            console.error("Error while fetching agents with the specific appId", error);
-        }
-    };
-    useEffect(() => {
-        getAgentsByAppId();
-    }, [appId, baseUrl]);
-    const handleAgentChange = (agent) => {
-        setSelectedAgent(agent);
-        console.log("Agent changed to:", agent.agentName);
-    };
-    return (_jsx(AssistantRuntimeProvider, { runtime: runtime, children: _jsx("div", { className: className, children: _jsx("div", { className: `flex flex-col h-full border rounded-lg overflow-hidden ${className}`, children: _jsx(Thread, { currentUserDetails: currentUserDetails, agents: agentList, initialAgentId: agentId, initialAgentName: agentName, onAgentChange: handleAgentChange }) }) }) }));
-};

package/dist/ikoncomponents/assistant-ui/agent-dropdown.d.ts

@@ -1,24 +0,0 @@
-export interface Agent {
-    agentDescription?: string;
-    agentID: string;
-    agentName: string;
-    agentRoles?: string[];
-    agentTasks?: object[];
-    appId: string;
-    createdAt: string;
-    createdBy: string;
-    mcpServerIds?: string[];
-    systemPrompt: string;
-    updatedAt: string;
-    updatedBy: string;
-    userName?: null | string;
-    [key: string]: any;
-}
-export interface AgentDropdownProps {
-    agents: Agent[];
-    selectedAgent?: Agent;
-    onSelectAgent: (agent: Agent) => void;
-    className?: string;
-    triggerClassName?: string;
-}
-export declare const AgentDropdown: ({ agents, selectedAgent, onSelectAgent, className, triggerClassName, }: AgentDropdownProps) => import("react/jsx-runtime").JSX.Element;

package/dist/ikoncomponents/assistant-ui/agent-dropdown.js

@@ -1,16 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState } from "react";
-import { ChevronDownIcon } from "lucide-react";
-import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, } from "../../shadcn/dropdown-menu";
-import { Button } from "../../shadcn/button";
-import { cn } from "../../utils/cn";
-export const AgentDropdown = ({ agents, selectedAgent, onSelectAgent, className, triggerClassName, }) => {
-    const [open, setOpen] = useState(false);
-    // const displayAgent = selectedAgent || (agents.length > 0 ? agents[0] : null);
-    const displayAgent = selectedAgent || null;
-    return (_jsxs(DropdownMenu, { open: open, onOpenChange: setOpen, children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "outline", className: cn("gap-2 px-3 py-2 text-sm font-medium rounded-2xl", triggerClassName), children: [_jsx("span", { className: "truncate", children: (displayAgent === null || displayAgent === void 0 ? void 0 : displayAgent.agentName) || "Select Agent" }), _jsx(ChevronDownIcon, { className: "size-4 shrink-0 opacity-50" })] }) }), _jsx(DropdownMenuContent, { align: "end", className: cn("min-w-[200px]", className), children: agents.length > 0 ? (_jsxs(_Fragment, { children: [_jsx(DropdownMenuLabel, { className: "px-2 py-1.5 text-xs font-semibold text-muted-foreground", children: "Agents" }), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuGroup, { children: agents.map((agent) => (_jsxs(DropdownMenuItem, { onClick: () => {
-                                    onSelectAgent(agent);
-                                    setOpen(false);
-                                }, className: cn("cursor-pointer flex flex-col gap-1", (displayAgent === null || displayAgent === void 0 ? void 0 : displayAgent.agentID) === agent.agentID && "bg-accent"), children: [_jsx("div", { className: "font-medium text-sm", children: agent.agentName }), agent.agentDescription && (_jsx("div", { className: "text-xs text-muted-foreground truncate", children: agent.agentDescription }))] }, agent.agentID))) })] })) : (_jsx("div", { className: "px-2 py-1.5 text-sm text-muted-foreground text-center", children: "No agents available" })) })] }));
-};

package/dist/ikoncomponents/assistant-ui/agentTextChatTransport.d.ts

@@ -1,30 +0,0 @@
-import { ChatTransport, UIMessage, UIMessageChunk, ChatRequestOptions } from "ai";
-export interface AgentTextChatTransportOptions {
-    provider: string;
-    model: string;
-    agentId: string;
-    agentName?: string;
-    temperature?: number;
-    maxTokens?: number;
-    baseUrl?: string;
-    additionalReferenceInfo?: object;
-}
-export declare class AgentTextChatTransport<UI_MESSAGE extends UIMessage = UIMessage> implements ChatTransport<UI_MESSAGE> {
-    private agentConfig;
-    private baseUrl;
-    private chatIdMap;
-    constructor(options: AgentTextChatTransportOptions);
-    updateAgentConfig(options: Partial<AgentTextChatTransportOptions>): void;
-    private getChatId;
-    sendMessages(options: {
-        trigger: "submit-message" | "regenerate-message";
-        chatId: string;
-        messageId: string | undefined;
-        messages: UI_MESSAGE[];
-        abortSignal: AbortSignal | undefined;
-    } & ChatRequestOptions): Promise<ReadableStream<UIMessageChunk>>;
-    reconnectToStream(options: {
-        chatId: string;
-    } & ChatRequestOptions): Promise<ReadableStream<UIMessageChunk> | null>;
-    private processResponseStream;
-}