@elevasis/ui 1.20.1 → 1.21.0

package/dist/{chunk-JZEXFQ6N.js → chunk-UZWZY7TJ.js}

@@ -1,8 +1,8 @@
 import { FilterBar } from './chunk-PDHTXPSF.js';
 import { CustomModal } from './chunk-GBMNCNHX.js';
-import { ListSkeleton, EmptyState, PageTitleCaption, CardHeader, APIErrorAlert } from './chunk-AWMZCYKH.js';
+import { ListSkeleton, EmptyState, PageTitleCaption, CardHeader, APIErrorAlert } from './chunk-BC6TJEON.js';
 import { AppShellLoader } from './chunk-WWEMNIHW.js';
-import { useDeleteCredential, useCreateCredential, useCredentials, MEMBERSHIP_STATUS_COLORS, transformMembershipToTableRow, CredentialSchemas } from './chunk-XOTN3X3Z.js';
+import { useDeleteCredential, useCreateCredential, useCredentials, MEMBERSHIP_STATUS_COLORS, transformMembershipToTableRow, CredentialSchemas } from './chunk-FATKFO7X.js';
 import { formatDateTime } from './chunk-IOKL7BKE.js';
 import { useInitialization } from './chunk-TUXTSEAF.js';
 import { useState, useEffect } from 'react';

package/dist/{chunk-UMFPUM7Q.js → chunk-V422ET6W.js}

@@ -1,7 +1,7 @@
 import { FilterBar } from './chunk-PDHTXPSF.js';
-import { CyberAreaChart } from './chunk-ERVB3QJQ.js';
-import { APIErrorAlert, CardHeader, StatsCardSkeleton, TrendIndicator, DetailCardSkeleton, EmptyState } from './chunk-AWMZCYKH.js';
-import { useResolveError, useResolveAllErrors, usePaginationState, useErrorDetails, useMarkAsRead } from './chunk-AQ5MQDSS.js';
+import { CyberAreaChart } from './chunk-FVBYSDM4.js';
+import { APIErrorAlert, CardHeader, StatsCardSkeleton, TrendIndicator, DetailCardSkeleton, EmptyState } from './chunk-BC6TJEON.js';
+import { useResolveError, useResolveAllErrors, usePaginationState, useErrorDetails, useMarkAsRead } from './chunk-EDAYKRPJ.js';
 import { formatBucketTime } from './chunk-LXHZYSMQ.js';
 import { formatDuration } from './chunk-XA34RETF.js';
 import { PAGE_SIZE_DEFAULT } from './chunk-IOKL7BKE.js';
@@ -1221,6 +1221,15 @@ function ErrorBreakdownTable({ startDate, endDate, onErrorClick }) {
     totalPages(total) > 1 && /* @__PURE__ */ jsx(Group, { justify: "flex-start", children: /* @__PURE__ */ jsx(Pagination, { total: totalPages(total), value: page, onChange: setPage, size: "sm", boundaries: 1 }) })
   ] }) });
 }
+function NotificationList({ notifications, isLoading, onClose, onNavigate }) {
+  if (isLoading) {
+    return /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, { size: "sm" }) });
+  }
+  if (notifications.length === 0) {
+    return /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No notifications" }) });
+  }
+  return /* @__PURE__ */ jsx(Stack, { gap: 0, children: notifications.map((notification) => /* @__PURE__ */ jsx(NotificationItem, { notification, onClose, onNavigate }, notification.id)) });
+}
 var categoryColors = {
   info: "blue",
   queue: "cyan",
@@ -1268,14 +1277,5 @@ function NotificationItem({ notification, onClose, onNavigate }) {
     }
   );
 }
-function NotificationList({ notifications, isLoading, onClose, onNavigate }) {
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, { size: "sm" }) });
-  }
-  if (notifications.length === 0) {
-    return /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No notifications" }) });
-  }
-  return /* @__PURE__ */ jsx(Stack, { gap: 0, children: notifications.map((notification) => /* @__PURE__ */ jsx(NotificationItem, { notification, onClose, onNavigate }, notification.id)) });
-}
 
 export { ActivityCard, ActivityFilters, ActivityTable, BusinessImpactCard, CostBreakdownCard, CostByModelTable, CostMetricsCard, ErrorAnalysisCard, ErrorBreakdownTable, ExecutionBreakdownTable, ExecutionHealthCard, ExecutionLogsFilters, ExecutionLogsTable, NotificationItem, NotificationList };

package/dist/components/chat/index.d.ts

@@ -0,0 +1,202 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
+import { ReactNode } from 'react';
+
+interface ChatSidebarProps {
+    /**
+     * Whether the sidebar is open
+     */
+    isOpen: boolean;
+    /**
+     * Optional title for the sidebar header
+     * @default 'Details'
+     */
+    title?: string;
+    /**
+     * Sidebar content
+     */
+    children: ReactNode;
+    /**
+     * Optional fixed width in pixels
+     * @default 320
+     */
+    width?: number;
+    /**
+     * Optional z-index for layering
+     * @default 10
+     */
+    zIndex?: number;
+}
+/**
+ * Shared chat sidebar component
+ *
+ * Provides a sliding sidebar panel that animates from the right side.
+ * Used across AI Studio sessions and Agent Chat for displaying contextual details.
+ *
+ * Features:
+ * - Smooth transform-based sliding animation
+ * - Fixed width with absolute positioning
+ * - Theme-aware styling with CSS variables
+ * - Customizable header with optional actions
+ * - Flexible content area via children prop
+ *
+ * Layout Pattern:
+ * Parent container must have `position: relative` and the content area should
+ * adjust its `marginRight` to match the sidebar width when open.
+ *
+ * @example
+ * ```tsx
+ * <div style={{ position: 'relative', height: '100vh' }}>
+ *   <div style={{
+ *     marginRight: isSidebarOpen ? '320px' : '0',
+ *     transition: 'margin-right 0.3s cubic-bezier(0.4, 0, 0.2, 1)'
+ *   }}>
+ *     // Main content
+ *   </div>
+ *   <ChatSidebar isOpen={isSidebarOpen} onClose={() => setIsOpen(false)}>
+ *     // Sidebar content
+ *   </ChatSidebar>
+ * </div>
+ * ```
+ */
+declare function ChatSidebar({ isOpen, title, children, width, zIndex }: ChatSidebarProps): react_jsx_runtime.JSX.Element;
+
+interface ChatHeaderProps {
+    title: string;
+    status?: {
+        label: string;
+        color: 'green' | 'gray' | 'red' | 'yellow' | 'blue';
+    };
+    contextUsage?: {
+        used: number;
+        total: number;
+    };
+    sidebarIcon?: ReactNode;
+    onToggleSidebar?: () => void;
+    isSidebarOpen?: boolean;
+    sidebarTooltip?: string;
+}
+/**
+ * Shared chat header component
+ * Displays title, status badge, context usage, and optional sidebar toggle
+ */
+declare function ChatHeader({ title, status, contextUsage, sidebarIcon, onToggleSidebar, isSidebarOpen, sidebarTooltip }: ChatHeaderProps): react_jsx_runtime.JSX.Element;
+
+interface ChatInputAreaProps {
+    input: string;
+    onInputChange: (value: string) => void;
+    onSend: () => void;
+    isDisabled?: boolean;
+    isProcessing?: boolean;
+    isConnected?: boolean;
+    placeholder?: string;
+}
+/**
+ * Tactical chat input area with focus glow and accent send button.
+ */
+declare const ChatInputArea: react.NamedExoticComponent<ChatInputAreaProps>;
+
+type MessageType = MessageEvent['type'];
+interface ChatMessage {
+    id: string;
+    role: 'user' | 'assistant';
+    messageType: MessageType;
+    text: string;
+    metadata?: MessageEvent;
+    turnNumber: number;
+    messageIndex?: number;
+    createdAt: Date;
+}
+
+/**
+ * Base Execution Engine type definitions
+ * Core types shared across all Execution Engine resources
+ */
+
+/**
+ * Unified message event type - covers all message types in sessions
+ * Replaces separate SessionTurnMessages and AgentActivityEvent mechanisms
+ */
+/**
+ * Structured action metadata attached to assistant messages.
+ * Frontend reads this instead of parsing text prefixes.
+ */
+type AssistantAction = {
+    kind: 'navigate';
+    path: string;
+    reason: string;
+} | {
+    kind: 'update_filters';
+    timeRange: string | null;
+    statusFilter: string | null;
+    searchQuery: string | null;
+};
+type MessageEvent = {
+    type: 'user_message';
+    text: string;
+} | {
+    type: 'assistant_message';
+    text: string;
+    _action?: AssistantAction;
+} | {
+    type: 'agent:started';
+} | {
+    type: 'agent:completed';
+} | {
+    type: 'agent:error';
+    error: string;
+} | {
+    type: 'agent:reasoning';
+    iteration: number;
+    reasoning: string;
+} | {
+    type: 'agent:tool_call';
+    toolName: string;
+    args: Record<string, unknown>;
+} | {
+    type: 'agent:tool_result';
+    toolName: string;
+    success: boolean;
+    result?: unknown;
+    error?: string;
+};
+
+interface ChatInterfaceProps {
+    messages: ChatMessage[];
+    input: string;
+    onInputChange: (value: string) => void;
+    onSendMessage: () => void;
+    isProcessing?: boolean;
+    isConnected?: boolean;
+    error?: string | null;
+    onClearError?: () => void;
+    emptyStateText?: string;
+    emptyStateSubtext?: string;
+    placeholder?: string;
+}
+/**
+ * Shared chat interface component
+ * Used across ai studio sessions and production agent chat
+ * Handles message display, auto-scroll, and input area
+ */
+declare function ChatInterface({ messages, input, onInputChange, onSendMessage, isProcessing, isConnected, error, onClearError, emptyStateText, emptyStateSubtext, placeholder }: ChatInterfaceProps): react_jsx_runtime.JSX.Element;
+
+interface MessageBubbleProps {
+    message: ChatMessage;
+}
+/**
+ * Shared chat message bubble component
+ * Used across all chat interfaces in the monorepo
+ * Supports all 8 message types including agent activity
+ */
+declare const MessageBubble: react.NamedExoticComponent<MessageBubbleProps>;
+
+/**
+ * Animated processing indicator with a light streak effect.
+ * Each letter brightens sequentially, creating the illusion
+ * of a streak of light sweeping across the text.
+ */
+declare function ProcessingIndicator(): react_jsx_runtime.JSX.Element;
+
+export { ChatHeader, ChatInputArea, ChatInterface, ChatSidebar, MessageBubble, ProcessingIndicator };
+export type { ChatHeaderProps, ChatInputAreaProps, ChatInterfaceProps, ChatSidebarProps, MessageBubbleProps };

package/dist/components/chat/index.js

@@ -0,0 +1,2 @@
+export { ChatHeader, ChatInputArea, ChatInterface, ChatSidebar, MessageBubble, ProcessingIndicator } from '../../chunk-ROSMICXG.js';
+import '../../chunk-3KMDHCAR.js';