@joai/core 0.2.0 → 0.4.0

package/dist/index.mjs

@@ -18,7 +18,32 @@ const getAppBaseUrl = (env) => {
 	if (env === "testnet") return "https://testnet.joai.ai";
 	return "https://joai.ai";
 };
+const getDigestBaseUrl = (env) => {
+	if (env === "local") return "http://localhost:3005";
+	if (env === "devnet") return "https://devnet-digests.joai.ai";
+	if (env === "testnet") return "https://testnet-digests.joai.ai";
+	return "https://digests.joai.ai";
+};
+const getMarketplaceBaseUrl = (env) => {
+	if (env === "local") return "http://localhost:3006";
+	if (env === "devnet") return "https://devnet-marketplace.joai.ai";
+	if (env === "testnet") return "https://testnet-marketplace.joai.ai";
+	return "https://marketplace.joai.ai";
+};
+const getAgentsBaseUrl = (env) => {
+	if (env === "local") return "http://localhost:3007";
+	if (env === "devnet") return "https://devnet-agents.joai.ai";
+	if (env === "testnet") return "https://testnet-agents.joai.ai";
+	return "https://agents.joai.ai";
+};
 const getMcpServerAgentUrl = (env, agent) => `${toSubdomainBaseUrl(env, "cortex")}/mcp/agents/${agent}`;
+const getSitesRootDomain = (env) => {
+	if (env === "local") return "sites.joai--api.test";
+	if (env === "devnet") return "devnet-sites.joai.ai";
+	if (env === "testnet") return "testnet-sites.joai.ai";
+	return "sites.joai.ai";
+};
+const getSiteUrl = (env, teamSlug, brandSlug) => `https://${getSitesRootDomain(env)}/${teamSlug}/${brandSlug}`;
 //#endregion
 //#region src/config/constants.ts
 const JoaiUrls = {
@@ -142,7 +167,7 @@ const sanitizeAlphanumeric = (val) => val.replace(/[^a-z0-9]/gi, "");
 const sanitizeNumeric = (val) => {
 	return (val.split(".").length > 2 && val.endsWith(".") ? val.slice(0, -1) : val).replace(/[^0-9\.]+/g, "");
 };
-const toNameInitials = (name) => name.split(" ").map((word) => word[0]).join("");
+const toNameInitials = (name) => name ? name.split(" ").map((word) => word[0]).join("").toUpperCase().slice(0, 2) : "?";
 const toPreviewText = (text, maxChars = 100) => {
 	if (!text) return "";
 	let sanitized = text.replace(/<\/?(h[1-6])[^>]*>/gi, " - ").replace(/<\/?(p|div|ul|ol|li|br|hr)[^>]*>/gi, " ").replace(/<[^>]+>/g, "").replace(/\s+/g, " ").trim();
@@ -167,6 +192,11 @@ const abbreviateNumber = (val) => {
 	const suffix = SI_SYMBOL[tier];
 	return (val / Math.pow(10, tier * 3)).toFixed(1) + suffix;
 };
+const toCurrencyDisplay = (valueInCents, currency = "USD") => new Intl.NumberFormat("en-US", {
+	style: "currency",
+	currency,
+	currencyDisplay: "symbol"
+}).format(valueInCents / 100);
 const toHexEncodedNonce = (nonce) => {
 	const hex = nonce.toString(16);
 	return hex.length % 2 ? "0" + hex : hex;
@@ -203,11 +233,22 @@ const withRetry = async (fn, validate, { maxRetries = 5, retryDelay = 1e3 } = {}
 //#endregion
 //#region src/helpers/asset.ts
 const AssetBaseUrl = "https://raw.githubusercontent.com/JoAiHQ/assets/main";
+const WarpsBaseUrl = "https://raw.githubusercontent.com/JoAiHQ/warps/main";
 const getAssetAppLogoUrl = (name) => `${AssetBaseUrl}/apps/logos/${name}`;
 const getAssetChainLogoUrl = (name) => `${AssetBaseUrl}/chains/logos/${name}`;
 const getAssetTokenLogoUrl = (name) => `${AssetBaseUrl}/tokens/logos/${name}`;
 const getAssetWalletLogoUrl = (name) => `${AssetBaseUrl}/wallets/logos/${name}`;
 const getAssetPartnerLogoUrl = (name) => `${AssetBaseUrl}/partners/logos/${name}`;
+const getWarpScreenshotUrl = (brandSlug, warpAlias, variant = "light") => {
+	return `${WarpsBaseUrl}/warps/${brandSlug}/images/${warpAlias}${variant === "light" ? "" : `-${variant}`}.png`;
+};
+//#endregion
+//#region src/helpers/warp.ts
+function resolveWarpText(text, locale = "en") {
+	if (!text) return "";
+	if (typeof text === "string") return text;
+	return text[locale] ?? text.en ?? Object.values(text)[0] ?? "";
+}
 //#endregion
 //#region src/budget/types.ts
 const PeriodTypeLabels = {
@@ -277,6 +318,14 @@ const OgImageColors = {
 	}
 };
 //#endregion
+//#region src/ogimage/helpers.ts
+const OG_BASE = "https://gen.joai.ai/image/og";
+function ogImageUrl(type, params) {
+	switch (type) {
+		case "meeting": return `${OG_BASE}/meeting/${params.code}`;
+	}
+}
+//#endregion
 //#region src/skill/types.ts
 const SkillType = {
 	Knowledge: "knowledge",
@@ -300,4 +349,4 @@ const SkillScope = {
 	Team: "team"
 };
 //#endregion
-export { ContractCategoryDisplayNames, DefaultCodeMetadata, HttpService, JoaiUrls, OG_IMAGE_CONFIG, OG_IMAGE_HEIGHT, OG_IMAGE_WIDTH, OgImageColors, PeriodTypeLabels, PeriodTypeOptions, SkillMediaBindingRole, SkillScope, SkillType, abbreviateNumber, getApiBaseUrl, getAppBaseUrl, getAssetAppLogoUrl, getAssetChainLogoUrl, getAssetPartnerLogoUrl, getAssetTokenLogoUrl, getAssetWalletLogoUrl, getCortexBaseUrl, getMcpServerAgentUrl, isFileFormatAudio, isFileFormatImage, isFileFormatVideo, sanitizeAlphanumeric, sanitizeNumeric, toHexEncodedNonce, toNameInitials, toNftId, toPreviewText, withRetry };
+export { ContractCategoryDisplayNames, DefaultCodeMetadata, HttpService, JoaiUrls, OG_IMAGE_CONFIG, OG_IMAGE_HEIGHT, OG_IMAGE_WIDTH, OgImageColors, PeriodTypeLabels, PeriodTypeOptions, SkillMediaBindingRole, SkillScope, SkillType, abbreviateNumber, getAgentsBaseUrl, getApiBaseUrl, getAppBaseUrl, getAssetAppLogoUrl, getAssetChainLogoUrl, getAssetPartnerLogoUrl, getAssetTokenLogoUrl, getAssetWalletLogoUrl, getCortexBaseUrl, getDigestBaseUrl, getMarketplaceBaseUrl, getMcpServerAgentUrl, getSiteUrl, getSitesRootDomain, getWarpScreenshotUrl, isFileFormatAudio, isFileFormatImage, isFileFormatVideo, ogImageUrl, resolveWarpText, sanitizeAlphanumeric, sanitizeNumeric, toCurrencyDisplay, toHexEncodedNonce, toNameInitials, toNftId, toPreviewText, withRetry };

package/dist/react/index.d.mts

@@ -0,0 +1,103 @@
+import { n as IHttpService } from "../types-C4eYYzWF.mjs";
+import * as react from "react";
+import { ReactNode } from "react";
+
+//#region src/react/types.d.ts
+type EmbedChatItem = {
+  content: string;
+  byUser: boolean;
+  streaming?: boolean;
+  error?: boolean;
+};
+//#endregion
+//#region src/react/guest.d.ts
+declare function getOrCreateGuestId(storageKey?: string): string;
+declare function loadRoom(storageKey: string): string | null;
+declare function saveRoom(storageKey: string, roomId: string): void;
+declare function clearRoom(storageKey: string): void;
+//#endregion
+//#region src/react/stream-connection.d.ts
+type StreamDataHandler = (data: unknown) => void;
+declare function openEventSourceStream(url: string, onData: StreamDataHandler, options?: {
+  withCredentials?: boolean;
+  onError?: (e: unknown) => void;
+  onConnectionError?: (e: Event | null) => void;
+}): () => void;
+//#endregion
+//#region src/react/components.d.ts
+type ListClassNames = {
+  container?: string;
+  userBubble?: string;
+  agentBubble?: string;
+  errorBubble?: string;
+  thinkingWrapper?: string;
+  dot?: string;
+};
+type EmbedChatListProps = {
+  items: EmbedChatItem[];
+  agentName: string;
+  awaitingResponse: boolean;
+  classNames?: ListClassNames;
+  renderEmptyState?: () => ReactNode;
+  renderAgentContent?: (item: EmbedChatItem) => ReactNode;
+};
+declare function EmbedChatList({
+  items,
+  agentName,
+  awaitingResponse,
+  classNames,
+  renderEmptyState,
+  renderAgentContent
+}: EmbedChatListProps): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react.JSX.Element | null | undefined;
+type EmbedChatInputProps = {
+  onSend: (message: string) => void;
+  disabled: boolean;
+  placeholder?: string;
+  maxLength?: number;
+  classNames?: {
+    container?: string;
+    textarea?: string;
+  };
+  renderSendButton: (props: {
+    onClick: () => void;
+    disabled: boolean;
+  }) => ReactNode;
+};
+declare function EmbedChatInput({
+  onSend,
+  disabled,
+  placeholder,
+  maxLength,
+  classNames,
+  renderSendButton
+}: EmbedChatInputProps): react.JSX.Element;
+//#endregion
+//#region src/react/use-embed-chat.d.ts
+type Options = {
+  agentUuid: string | null;
+  http: IHttpService;
+  cortexBaseUrl: string;
+  guestId: string;
+  roomStorageKey: string;
+  enabled?: boolean;
+  extraPayload?: Record<string, unknown>;
+};
+declare function useEmbedChat({
+  agentUuid,
+  http,
+  cortexBaseUrl,
+  guestId,
+  roomStorageKey,
+  enabled,
+  extraPayload
+}: Options): {
+  items: EmbedChatItem[];
+  setItems: react.Dispatch<react.SetStateAction<EmbedChatItem[]>>;
+  sending: boolean;
+  awaitingResponse: boolean;
+  roomId: string | null;
+  setRoomId: react.Dispatch<react.SetStateAction<string | null>>;
+  send: (message: string) => Promise<void>;
+};
+//#endregion
+export { EmbedChatInput, EmbedChatItem, EmbedChatList, StreamDataHandler, clearRoom, getOrCreateGuestId, loadRoom, openEventSourceStream, saveRoom, useEmbedChat };

package/dist/react/index.mjs

@@ -0,0 +1,269 @@
+import { useCallback, useEffect, useRef, useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/react/guest.ts
+function safeGet(key) {
+	try {
+		return localStorage.getItem(key);
+	} catch {
+		return null;
+	}
+}
+function safeSet(key, value) {
+	try {
+		localStorage.setItem(key, value);
+	} catch {}
+}
+function safeRemove(key) {
+	try {
+		localStorage.removeItem(key);
+	} catch {}
+}
+function getOrCreateGuestId(storageKey = "joai_embed_guest") {
+	if (typeof window === "undefined") return "";
+	const existing = safeGet(storageKey);
+	if (existing) return existing;
+	const id = crypto.randomUUID();
+	safeSet(storageKey, id);
+	return id;
+}
+function loadRoom(storageKey) {
+	return safeGet(storageKey);
+}
+function saveRoom(storageKey, roomId) {
+	safeSet(storageKey, roomId);
+}
+function clearRoom(storageKey) {
+	safeRemove(storageKey);
+}
+//#endregion
+//#region src/react/stream-connection.ts
+function openEventSourceStream(url, onData, options) {
+	const es = new EventSource(url, { withCredentials: options?.withCredentials ?? false });
+	es.onmessage = (event) => {
+		try {
+			onData(JSON.parse(event.data));
+		} catch (e) {
+			options?.onError?.(e);
+		}
+	};
+	es.onerror = (event) => {
+		options?.onConnectionError?.(event);
+	};
+	return () => es.close();
+}
+//#endregion
+//#region src/react/components.tsx
+function EmbedChatList({ items, agentName, awaitingResponse, classNames = {}, renderEmptyState, renderAgentContent }) {
+	const containerRef = useRef(null);
+	useEffect(() => {
+		const el = containerRef.current;
+		if (!el) return;
+		if (el.scrollHeight - el.scrollTop - el.clientHeight < 120) el.scrollTop = el.scrollHeight;
+	}, [items, awaitingResponse]);
+	if (items.length === 0 && !awaitingResponse) return renderEmptyState ? renderEmptyState() : /* @__PURE__ */ jsx("div", {
+		className: classNames.container,
+		children: /* @__PURE__ */ jsxs("p", { children: [
+			"Send ",
+			agentName,
+			" a message to start chatting"
+		] })
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		ref: containerRef,
+		className: classNames.container,
+		role: "log",
+		"aria-live": "polite",
+		children: [items.map((item, i) => /* @__PURE__ */ jsx(EmbedChatBubble, {
+			item,
+			classNames,
+			renderAgentContent
+		}, i)), awaitingResponse && /* @__PURE__ */ jsx(EmbedThinkingIndicator, {
+			wrapperClassName: classNames.thinkingWrapper,
+			dotClassName: classNames.dot
+		})]
+	});
+}
+function EmbedChatBubble({ item, classNames, renderAgentContent }) {
+	if (item.byUser) return /* @__PURE__ */ jsx("div", {
+		className: classNames.userBubble,
+		children: item.content
+	});
+	return /* @__PURE__ */ jsx("div", {
+		className: item.error ? classNames.errorBubble : classNames.agentBubble,
+		children: renderAgentContent ? renderAgentContent(item) : /* @__PURE__ */ jsxs(Fragment, { children: [item.content, item.streaming && /* @__PURE__ */ jsx("span", { className: "inline-block w-1 h-3 ml-1 bg-current animate-pulse rounded-full" })] })
+	});
+}
+function EmbedThinkingIndicator({ wrapperClassName, dotClassName }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: wrapperClassName,
+		children: /* @__PURE__ */ jsxs("span", {
+			className: "inline-flex gap-1",
+			children: [
+				/* @__PURE__ */ jsx("span", {
+					className: dotClassName,
+					style: { animationDelay: "0ms" }
+				}),
+				/* @__PURE__ */ jsx("span", {
+					className: dotClassName,
+					style: { animationDelay: "150ms" }
+				}),
+				/* @__PURE__ */ jsx("span", {
+					className: dotClassName,
+					style: { animationDelay: "300ms" }
+				})
+			]
+		})
+	});
+}
+function EmbedChatInput({ onSend, disabled, placeholder = "Type a message...", maxLength = 4e3, classNames = {}, renderSendButton }) {
+	const [text, setText] = useState("");
+	const textareaRef = useRef(null);
+	function handleSend() {
+		const trimmed = text.trim();
+		if (!trimmed || disabled) return;
+		onSend(trimmed);
+		setText("");
+		if (textareaRef.current) textareaRef.current.style.height = "auto";
+	}
+	function handleKeyDown(e) {
+		if (e.key === "Enter" && !e.shiftKey) {
+			e.preventDefault();
+			handleSend();
+		}
+	}
+	function handleInput() {
+		if (textareaRef.current) {
+			textareaRef.current.style.height = "auto";
+			textareaRef.current.style.height = Math.min(textareaRef.current.scrollHeight, 120) + "px";
+		}
+	}
+	return /* @__PURE__ */ jsxs("div", {
+		className: classNames.container,
+		children: [/* @__PURE__ */ jsx("textarea", {
+			ref: textareaRef,
+			value: text,
+			onChange: (e) => setText(e.target.value),
+			onKeyDown: handleKeyDown,
+			onInput: handleInput,
+			placeholder,
+			"aria-label": "Message input",
+			maxLength,
+			rows: 1,
+			disabled,
+			className: classNames.textarea
+		}), renderSendButton({
+			onClick: handleSend,
+			disabled: disabled || !text.trim()
+		})]
+	});
+}
+//#endregion
+//#region src/react/use-embed-chat.ts
+function useEmbedChat({ agentUuid, http, cortexBaseUrl, guestId, roomStorageKey, enabled = true, extraPayload }) {
+	const [items, setItems] = useState([]);
+	const [sending, setSending] = useState(false);
+	const [awaitingResponse, setAwaitingResponse] = useState(false);
+	const [roomId, setRoomId] = useState(null);
+	const roomIdRef = useRef(null);
+	roomIdRef.current = roomId;
+	const extraPayloadRef = useRef(extraPayload);
+	extraPayloadRef.current = extraPayload;
+	useEffect(() => {
+		if (!roomId) return;
+		return openEventSourceStream(`${cortexBaseUrl}/agents/stream/${roomId}`, (raw) => {
+			const data = raw;
+			if (data.type === "response:chunk") {
+				setAwaitingResponse(false);
+				setItems((prev) => {
+					const last = prev[prev.length - 1];
+					if (last && last.streaming && !last.byUser) {
+						const updated = [...prev];
+						updated[updated.length - 1] = {
+							...last,
+							content: last.content + (data.content ?? "")
+						};
+						return updated;
+					}
+					return [...prev, {
+						content: data.content ?? "",
+						byUser: false,
+						streaming: true
+					}];
+				});
+			} else if (data.type === "response") {
+				setAwaitingResponse(false);
+				setItems((prev) => {
+					const updated = [...prev];
+					const lastIdx = updated.length - 1;
+					if (lastIdx >= 0 && updated[lastIdx].streaming) updated[lastIdx] = {
+						...updated[lastIdx],
+						content: data.content ?? updated[lastIdx].content,
+						streaming: false
+					};
+					else updated.push({
+						content: data.content ?? "",
+						byUser: false
+					});
+					return updated;
+				});
+			} else if (data.type === "complete") setItems((prev) => prev.map((item) => item.streaming ? {
+				...item,
+				streaming: false
+			} : item));
+		});
+	}, [roomId, cortexBaseUrl]);
+	return {
+		items,
+		setItems,
+		sending,
+		awaitingResponse,
+		roomId,
+		setRoomId,
+		send: useCallback(async (message) => {
+			if (!enabled || sending || !agentUuid) return;
+			setItems((prev) => [...prev, {
+				content: message,
+				byUser: true
+			}]);
+			setSending(true);
+			try {
+				const res = await http.post(`integrations/embed/${agentUuid}/execute`, {
+					message,
+					guestId,
+					...extraPayloadRef.current
+				});
+				if (!res.ok) {
+					setItems((prev) => [...prev, {
+						content: "Something went wrong. Please try again.",
+						byUser: false,
+						error: true
+					}]);
+					return;
+				}
+				setAwaitingResponse(true);
+				const newRoomId = res.data?.roomId;
+				if (newRoomId && !roomIdRef.current) {
+					setRoomId(newRoomId);
+					saveRoom(roomStorageKey, newRoomId);
+				}
+			} catch {
+				setItems((prev) => [...prev, {
+					content: "Something went wrong. Please try again.",
+					byUser: false,
+					error: true
+				}]);
+			} finally {
+				setSending(false);
+			}
+		}, [
+			enabled,
+			sending,
+			agentUuid,
+			http,
+			guestId,
+			roomStorageKey
+		])
+	};
+}
+//#endregion
+export { EmbedChatInput, EmbedChatList, clearRoom, getOrCreateGuestId, loadRoom, openEventSourceStream, saveRoom, useEmbedChat };

package/dist/types-C4eYYzWF.d.mts

@@ -0,0 +1,31 @@
+//#region src/http/types.d.ts
+interface IHttpService {
+  readonly baseUrl: string;
+  readonly authToken: string | null;
+  onNetworkError: (error: Error) => void;
+  onUnauthorized: (response: IAppResponse<any>) => void;
+  onSuccessfulResponse: (response: IAppResponse<any>) => void;
+  onMaintenanceMode: (response: IAppResponse<any>) => void;
+  get: <T>(url: string, options?: IRequestOptions) => Promise<IAppResponse<T>>;
+  post: <T>(url: string, data?: any, options?: IRequestOptions) => Promise<IAppResponse<T>>;
+  put: <T>(url: string, data?: any, options?: IRequestOptions) => Promise<IAppResponse<T>>;
+  delete: <T>(url: string, options?: IRequestOptions) => Promise<IAppResponse<T>>;
+}
+interface IAppResponse<T> {
+  data: T;
+  meta?: any;
+  body: any;
+  errors: any;
+  ok: boolean;
+  paymentRequired: boolean;
+  noContent: boolean;
+  original: Response;
+}
+interface IRequestOptions {
+  isJson?: boolean;
+  headers?: {
+    [name: string]: string;
+  };
+}
+//#endregion
+export { IHttpService as n, IRequestOptions as r, IAppResponse as t };

package/package.json

@@ -1,14 +1,19 @@
 {
   "name": "@joai/core",
-  "version": "0.2.0",
+  "version": "0.4.0",
   "description": "JoAi shared types, HTTP service, and config",
   "license": "MIT",
   "type": "module",
   "main": "./dist/index.mjs",
+  "types": "./dist/index.d.mts",
   "exports": {
     ".": {
       "import": "./dist/index.mjs",
       "types": "./dist/index.d.mts"
+    },
+    "./react": {
+      "import": "./dist/react/index.mjs",
+      "types": "./dist/react/index.d.mts"
     }
   },
   "files": [
@@ -21,10 +26,17 @@
     "test:watch": "jest --watch"
   },
   "peerDependencies": {
-    "@joai/warps": ">=4.0.0"
+    "@joai/warps": ">=4.0.0",
+    "react": ">=18.0.0"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    }
   },
   "devDependencies": {
     "@types/jest": "^30.0.0",
+    "@types/react": "^19.2.14",
     "jest": "^30.3.0",
     "ts-jest": "^29.4.6",
     "tsdown": "^0.21.0",