@streamoid/agent 0.1.0

package/dist/index.d.mts

@@ -0,0 +1,80 @@
+import * as react from 'react';
+import { CSSProperties } from 'react';
+
+/** Workspace context, passed through whole — extra fields are preserved, never dropped. */
+interface AgentWorkspace {
+    id: string;
+    name?: string;
+    role?: string;
+    /** ISO country code, if the host has it. */
+    country?: string;
+    /** Display currency, if the host has it. */
+    currency?: string;
+    locale?: string;
+    availableCredits?: number | null;
+    totalCredits?: number | null;
+    [key: string]: unknown;
+}
+interface AgentUser {
+    id: string;
+    email: string;
+    specialization?: string | null;
+    [key: string]: unknown;
+}
+interface AgentNotification {
+    title?: string;
+    body?: string;
+}
+interface AgentPanelAdapters {
+    auth: {
+        user: AgentUser;
+    };
+    workspace: {
+        current: AgentWorkspace;
+    };
+    theme: {
+        mode: "light" | "dark";
+    };
+    config: {
+        /** Copilot widget origin/base (Phase-1 transitional; removed when native). */
+        widgetUrl: string;
+        hide?: {
+            sidepane?: boolean;
+            newBrief?: boolean;
+            notifications?: boolean;
+        };
+    };
+    navigation: {
+        /** Conversation to load on (re)mount; subsequent navigation goes through the ref. */
+        seedChatId?: string | null;
+        /** Fired when the agent navigates to (or clears) a conversation. */
+        onNavigated: (chatId: string | null) => void;
+        /** Fired once the agent has booted and is accepting commands. */
+        onReady?: () => void;
+    };
+    notifications: {
+        onProcessingComplete: (payload?: AgentNotification) => void;
+        onAttentionNeeded: (payload?: AgentNotification) => void;
+    };
+}
+/** Imperative actions the host triggers (sidebar new/open, chat-not-found reload). */
+interface AgentPanelHandle {
+    /** Start a new conversation. */
+    newChat: () => void;
+    /** Switch the displayed conversation. */
+    navigateTo: (chatId: string) => void;
+    /** Remount the panel, optionally seeding a conversation (null = home). */
+    reload: (seedChatId?: string | null) => void;
+}
+interface AgentPanelProps {
+    adapters: AgentPanelAdapters;
+    className?: string;
+    style?: CSSProperties;
+    /** Corner radius for the panel + loading overlay. */
+    borderRadius?: number | string;
+    /** Text shown while the agent boots. */
+    loadingLabel?: string;
+}
+declare const AgentPanel: react.ForwardRefExoticComponent<AgentPanelProps & react.RefAttributes<AgentPanelHandle>>;
+
+export { type AgentNotification, AgentPanel, type AgentPanelAdapters, type AgentPanelHandle, type AgentPanelProps, type AgentUser, type AgentWorkspace };

package/dist/index.d.ts

@@ -0,0 +1,80 @@
+import * as react from 'react';
+import { CSSProperties } from 'react';
+
+/** Workspace context, passed through whole — extra fields are preserved, never dropped. */
+interface AgentWorkspace {
+    id: string;
+    name?: string;
+    role?: string;
+    /** ISO country code, if the host has it. */
+    country?: string;
+    /** Display currency, if the host has it. */
+    currency?: string;
+    locale?: string;
+    availableCredits?: number | null;
+    totalCredits?: number | null;
+    [key: string]: unknown;
+}
+interface AgentUser {
+    id: string;
+    email: string;
+    specialization?: string | null;
+    [key: string]: unknown;
+}
+interface AgentNotification {
+    title?: string;
+    body?: string;
+}
+interface AgentPanelAdapters {
+    auth: {
+        user: AgentUser;
+    };
+    workspace: {
+        current: AgentWorkspace;
+    };
+    theme: {
+        mode: "light" | "dark";
+    };
+    config: {
+        /** Copilot widget origin/base (Phase-1 transitional; removed when native). */
+        widgetUrl: string;
+        hide?: {
+            sidepane?: boolean;
+            newBrief?: boolean;
+            notifications?: boolean;
+        };
+    };
+    navigation: {
+        /** Conversation to load on (re)mount; subsequent navigation goes through the ref. */
+        seedChatId?: string | null;
+        /** Fired when the agent navigates to (or clears) a conversation. */
+        onNavigated: (chatId: string | null) => void;
+        /** Fired once the agent has booted and is accepting commands. */
+        onReady?: () => void;
+    };
+    notifications: {
+        onProcessingComplete: (payload?: AgentNotification) => void;
+        onAttentionNeeded: (payload?: AgentNotification) => void;
+    };
+}
+/** Imperative actions the host triggers (sidebar new/open, chat-not-found reload). */
+interface AgentPanelHandle {
+    /** Start a new conversation. */
+    newChat: () => void;
+    /** Switch the displayed conversation. */
+    navigateTo: (chatId: string) => void;
+    /** Remount the panel, optionally seeding a conversation (null = home). */
+    reload: (seedChatId?: string | null) => void;
+}
+interface AgentPanelProps {
+    adapters: AgentPanelAdapters;
+    className?: string;
+    style?: CSSProperties;
+    /** Corner radius for the panel + loading overlay. */
+    borderRadius?: number | string;
+    /** Text shown while the agent boots. */
+    loadingLabel?: string;
+}
+declare const AgentPanel: react.ForwardRefExoticComponent<AgentPanelProps & react.RefAttributes<AgentPanelHandle>>;
+
+export { type AgentNotification, AgentPanel, type AgentPanelAdapters, type AgentPanelHandle, type AgentPanelProps, type AgentUser, type AgentWorkspace };

package/dist/index.js

@@ -0,0 +1,207 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  AgentPanel: () => AgentPanel
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/AgentPanel.tsx
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+function normalizeChatId(value) {
+  const trimmed = value?.trim();
+  return trimmed ? trimmed : null;
+}
+function buildSrc(adapters, seedChatId) {
+  const { auth, workspace, theme, config } = adapters;
+  const base = config.widgetUrl.endsWith("/widget/") ? config.widgetUrl : `${config.widgetUrl.replace(/\/+$/, "")}/widget/`;
+  const url = new URL(base);
+  if (workspace.current.id) url.searchParams.set("workspaceId", workspace.current.id);
+  if (auth.user.id) url.searchParams.set("userId", auth.user.id);
+  if (auth.user.email) url.searchParams.set("email", auth.user.email);
+  if (auth.user.specialization != null) {
+    url.searchParams.set("userSpecialization", String(auth.user.specialization));
+  }
+  url.searchParams.set("theme", theme.mode);
+  if (typeof window !== "undefined") {
+    url.searchParams.set("parentOrigin", window.location.origin);
+  }
+  if (config.hide?.sidepane) url.searchParams.set("hideSidepane", "1");
+  if (config.hide?.newBrief) url.searchParams.set("hideNewBrief", "1");
+  if (config.hide?.notifications) url.searchParams.set("hideNotifications", "1");
+  return `${url.toString()}#${seedChatId ? `/chat/${seedChatId}` : "/"}`;
+}
+function isNotificationType(type) {
+  return type === "chat:processing-complete" || type === "chat:attention-needed";
+}
+var AgentPanel = (0, import_react.forwardRef)(
+  function AgentPanel2({ adapters, className, style, borderRadius, loadingLabel = "Loading\u2026" }, ref) {
+    const { auth, workspace, theme, config, navigation, notifications } = adapters;
+    const workspaceId = workspace.current.id;
+    const iframeRef = (0, import_react.useRef)(null);
+    const widgetOrigin = (0, import_react.useMemo)(() => {
+      try {
+        return new URL(config.widgetUrl).origin;
+      } catch {
+        return "*";
+      }
+    }, [config.widgetUrl]);
+    const [loaded, setLoaded] = (0, import_react.useState)(false);
+    const [ready, setReady] = (0, import_react.useState)(false);
+    const [reloadNonce, setReloadNonce] = (0, import_react.useState)(0);
+    const seedRef = (0, import_react.useRef)(normalizeChatId(navigation.seedChatId));
+    const mountKey = `${auth.user.id}|${auth.user.specialization ?? ""}|${reloadNonce}`;
+    const lastThemeRef = (0, import_react.useRef)(null);
+    const lastWorkspaceRef = (0, import_react.useRef)(null);
+    const pendingRef = (0, import_react.useRef)(null);
+    const srcRef = (0, import_react.useRef)({ key: "", src: "" });
+    if (srcRef.current.key !== mountKey) {
+      srcRef.current = { key: mountKey, src: buildSrc(adapters, seedRef.current) };
+      lastThemeRef.current = theme.mode;
+      lastWorkspaceRef.current = workspaceId;
+    }
+    const src = srcRef.current.src;
+    const postNow = (0, import_react.useCallback)(
+      (message) => {
+        iframeRef.current?.contentWindow?.postMessage(message, widgetOrigin);
+      },
+      [widgetOrigin]
+    );
+    const post = (0, import_react.useCallback)(
+      (message) => {
+        if (!ready || !iframeRef.current?.contentWindow) {
+          pendingRef.current = message;
+          return;
+        }
+        postNow(message);
+      },
+      [ready, postNow]
+    );
+    (0, import_react.useEffect)(() => {
+      setLoaded(false);
+      setReady(false);
+      pendingRef.current = null;
+    }, [mountKey]);
+    (0, import_react.useEffect)(() => {
+      function handle(event) {
+        if (widgetOrigin !== "*" && event.origin !== widgetOrigin) return;
+        if (event.source !== iframeRef.current?.contentWindow) return;
+        const data = event.data;
+        if (!data?.type) return;
+        if (data.type === "chat:ready") {
+          setReady(true);
+          navigation.onReady?.();
+        } else if (data.type === "chat:navigated") {
+          navigation.onNavigated(normalizeChatId(data.payload?.chatId));
+        } else if (isNotificationType(data.type)) {
+          const payload = data.payload;
+          if (data.type === "chat:processing-complete") {
+            notifications.onProcessingComplete(payload);
+          } else {
+            notifications.onAttentionNeeded(payload);
+          }
+        }
+      }
+      window.addEventListener("message", handle);
+      return () => window.removeEventListener("message", handle);
+    }, [navigation, notifications, widgetOrigin]);
+    (0, import_react.useEffect)(() => {
+      if (!ready) return;
+      const pending = pendingRef.current;
+      if (pending) {
+        pendingRef.current = null;
+        postNow(pending);
+      }
+    }, [ready, postNow]);
+    (0, import_react.useEffect)(() => {
+      if (!ready) return;
+      if (lastWorkspaceRef.current === workspaceId) return;
+      postNow({ type: "chat:switch-workspace", payload: { workspaceId } });
+      lastWorkspaceRef.current = workspaceId;
+    }, [ready, workspaceId, postNow]);
+    (0, import_react.useEffect)(() => {
+      if (!ready) return;
+      if (lastThemeRef.current === theme.mode) return;
+      postNow({ type: "chat:set-theme", payload: { theme: theme.mode } });
+      lastThemeRef.current = theme.mode;
+    }, [ready, theme.mode, postNow]);
+    (0, import_react.useImperativeHandle)(
+      ref,
+      () => ({
+        newChat: () => post({ type: "chat:new" }),
+        navigateTo: (chatId) => post({ type: "chat:navigate", payload: { chatId } }),
+        reload: (seedChatId) => {
+          seedRef.current = normalizeChatId(seedChatId);
+          setReloadNonce((n) => n + 1);
+        }
+      }),
+      [post]
+    );
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "div",
+      {
+        className,
+        style: { position: "relative", height: "100%", width: "100%", ...style },
+        children: [
+          !loaded ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "div",
+            {
+              style: {
+                position: "absolute",
+                inset: 0,
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
+                borderRadius,
+                backgroundColor: "var(--alias-surface-base)"
+              },
+              children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "span",
+                {
+                  style: {
+                    color: "var(--alias-text---icons-muted)",
+                    fontFamily: "var(--font-family-font-family-body)",
+                    fontSize: "var(--font-size-font-size-sm)"
+                  },
+                  children: loadingLabel
+                }
+              )
+            }
+          ) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { height: "100%", width: "100%", overflow: "hidden", borderRadius }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "iframe",
+            {
+              ref: iframeRef,
+              title: "Streamoid Copilot",
+              src,
+              style: { height: "100%", width: "100%", border: 0, background: "transparent" },
+              onLoad: () => setLoaded(true),
+              referrerPolicy: "strict-origin-when-cross-origin",
+              allow: "clipboard-write"
+            },
+            mountKey
+          ) })
+        ]
+      }
+    );
+  }
+);

package/dist/index.mjs

@@ -0,0 +1,192 @@
+// src/AgentPanel.tsx
+import {
+  forwardRef,
+  useCallback,
+  useEffect,
+  useImperativeHandle,
+  useMemo,
+  useRef,
+  useState
+} from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function normalizeChatId(value) {
+  const trimmed = value?.trim();
+  return trimmed ? trimmed : null;
+}
+function buildSrc(adapters, seedChatId) {
+  const { auth, workspace, theme, config } = adapters;
+  const base = config.widgetUrl.endsWith("/widget/") ? config.widgetUrl : `${config.widgetUrl.replace(/\/+$/, "")}/widget/`;
+  const url = new URL(base);
+  if (workspace.current.id) url.searchParams.set("workspaceId", workspace.current.id);
+  if (auth.user.id) url.searchParams.set("userId", auth.user.id);
+  if (auth.user.email) url.searchParams.set("email", auth.user.email);
+  if (auth.user.specialization != null) {
+    url.searchParams.set("userSpecialization", String(auth.user.specialization));
+  }
+  url.searchParams.set("theme", theme.mode);
+  if (typeof window !== "undefined") {
+    url.searchParams.set("parentOrigin", window.location.origin);
+  }
+  if (config.hide?.sidepane) url.searchParams.set("hideSidepane", "1");
+  if (config.hide?.newBrief) url.searchParams.set("hideNewBrief", "1");
+  if (config.hide?.notifications) url.searchParams.set("hideNotifications", "1");
+  return `${url.toString()}#${seedChatId ? `/chat/${seedChatId}` : "/"}`;
+}
+function isNotificationType(type) {
+  return type === "chat:processing-complete" || type === "chat:attention-needed";
+}
+var AgentPanel = forwardRef(
+  function AgentPanel2({ adapters, className, style, borderRadius, loadingLabel = "Loading\u2026" }, ref) {
+    const { auth, workspace, theme, config, navigation, notifications } = adapters;
+    const workspaceId = workspace.current.id;
+    const iframeRef = useRef(null);
+    const widgetOrigin = useMemo(() => {
+      try {
+        return new URL(config.widgetUrl).origin;
+      } catch {
+        return "*";
+      }
+    }, [config.widgetUrl]);
+    const [loaded, setLoaded] = useState(false);
+    const [ready, setReady] = useState(false);
+    const [reloadNonce, setReloadNonce] = useState(0);
+    const seedRef = useRef(normalizeChatId(navigation.seedChatId));
+    const mountKey = `${auth.user.id}|${auth.user.specialization ?? ""}|${reloadNonce}`;
+    const lastThemeRef = useRef(null);
+    const lastWorkspaceRef = useRef(null);
+    const pendingRef = useRef(null);
+    const srcRef = useRef({ key: "", src: "" });
+    if (srcRef.current.key !== mountKey) {
+      srcRef.current = { key: mountKey, src: buildSrc(adapters, seedRef.current) };
+      lastThemeRef.current = theme.mode;
+      lastWorkspaceRef.current = workspaceId;
+    }
+    const src = srcRef.current.src;
+    const postNow = useCallback(
+      (message) => {
+        iframeRef.current?.contentWindow?.postMessage(message, widgetOrigin);
+      },
+      [widgetOrigin]
+    );
+    const post = useCallback(
+      (message) => {
+        if (!ready || !iframeRef.current?.contentWindow) {
+          pendingRef.current = message;
+          return;
+        }
+        postNow(message);
+      },
+      [ready, postNow]
+    );
+    useEffect(() => {
+      setLoaded(false);
+      setReady(false);
+      pendingRef.current = null;
+    }, [mountKey]);
+    useEffect(() => {
+      function handle(event) {
+        if (widgetOrigin !== "*" && event.origin !== widgetOrigin) return;
+        if (event.source !== iframeRef.current?.contentWindow) return;
+        const data = event.data;
+        if (!data?.type) return;
+        if (data.type === "chat:ready") {
+          setReady(true);
+          navigation.onReady?.();
+        } else if (data.type === "chat:navigated") {
+          navigation.onNavigated(normalizeChatId(data.payload?.chatId));
+        } else if (isNotificationType(data.type)) {
+          const payload = data.payload;
+          if (data.type === "chat:processing-complete") {
+            notifications.onProcessingComplete(payload);
+          } else {
+            notifications.onAttentionNeeded(payload);
+          }
+        }
+      }
+      window.addEventListener("message", handle);
+      return () => window.removeEventListener("message", handle);
+    }, [navigation, notifications, widgetOrigin]);
+    useEffect(() => {
+      if (!ready) return;
+      const pending = pendingRef.current;
+      if (pending) {
+        pendingRef.current = null;
+        postNow(pending);
+      }
+    }, [ready, postNow]);
+    useEffect(() => {
+      if (!ready) return;
+      if (lastWorkspaceRef.current === workspaceId) return;
+      postNow({ type: "chat:switch-workspace", payload: { workspaceId } });
+      lastWorkspaceRef.current = workspaceId;
+    }, [ready, workspaceId, postNow]);
+    useEffect(() => {
+      if (!ready) return;
+      if (lastThemeRef.current === theme.mode) return;
+      postNow({ type: "chat:set-theme", payload: { theme: theme.mode } });
+      lastThemeRef.current = theme.mode;
+    }, [ready, theme.mode, postNow]);
+    useImperativeHandle(
+      ref,
+      () => ({
+        newChat: () => post({ type: "chat:new" }),
+        navigateTo: (chatId) => post({ type: "chat:navigate", payload: { chatId } }),
+        reload: (seedChatId) => {
+          seedRef.current = normalizeChatId(seedChatId);
+          setReloadNonce((n) => n + 1);
+        }
+      }),
+      [post]
+    );
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className,
+        style: { position: "relative", height: "100%", width: "100%", ...style },
+        children: [
+          !loaded ? /* @__PURE__ */ jsx(
+            "div",
+            {
+              style: {
+                position: "absolute",
+                inset: 0,
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
+                borderRadius,
+                backgroundColor: "var(--alias-surface-base)"
+              },
+              children: /* @__PURE__ */ jsx(
+                "span",
+                {
+                  style: {
+                    color: "var(--alias-text---icons-muted)",
+                    fontFamily: "var(--font-family-font-family-body)",
+                    fontSize: "var(--font-size-font-size-sm)"
+                  },
+                  children: loadingLabel
+                }
+              )
+            }
+          ) : null,
+          /* @__PURE__ */ jsx("div", { style: { height: "100%", width: "100%", overflow: "hidden", borderRadius }, children: /* @__PURE__ */ jsx(
+            "iframe",
+            {
+              ref: iframeRef,
+              title: "Streamoid Copilot",
+              src,
+              style: { height: "100%", width: "100%", border: 0, background: "transparent" },
+              onLoad: () => setLoaded(true),
+              referrerPolicy: "strict-origin-when-cross-origin",
+              allow: "clipboard-write"
+            },
+            mountKey
+          ) })
+        ]
+      }
+    );
+  }
+);
+export {
+  AgentPanel
+};

package/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "@streamoid/agent",
+  "version": "0.1.0",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "sideEffects": false,
+  "scripts": {
+    "build": "npm run build:js && npm run build:dts",
+    "build:js": "esbuild src/index.ts --bundle --external:react --external:react-dom --outfile=dist/index.js --format=cjs && esbuild src/index.ts --bundle --external:react --external:react-dom --outfile=dist/index.mjs --format=esm",
+    "build:dts": "tsup src/index.ts --dts-only",
+    "lint": "eslint src/",
+    "typecheck": "tsc --noEmit"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "tsup": "^8.0.0",
+    "typescript": "^5.0.0"
+  }
+}