@messenger-box/tailwind-ui-inbox 10.0.3-alpha.100

package/src/machines/index.ts

@@ -0,0 +1,2 @@
+export * from './aiAgentMachine';
+export * from './types';

package/src/machines/types.ts

@@ -0,0 +1,59 @@
+export interface Message {
+    id: string;
+    content: string;
+    sender: 'user' | 'ai';
+    timestamp: Date;
+}
+
+export interface MCPData {
+    searchResults?: Array<{
+        title: string;
+        url: string;
+        snippet: string;
+        source?: string;
+    }>;
+    newsArticles?: Array<{
+        title: string;
+        url: string;
+        description: string;
+        publishedAt: string;
+        source: { name: string };
+    }>;
+    summary: string;
+    sources: string[];
+    searchTime: number;
+}
+
+export interface AIAgentContext {
+    messages: Message[];
+    currentInput: string;
+    error: string | null;
+    isTyping: boolean;
+    mcpData?: MCPData;
+    multiMessageMode?: boolean;
+    currentMultiStep?: number;
+    totalMultiSteps?: number;
+    multiMessagePlan?: string[];
+    regularMessages?: any[]; // Add regular messages from query
+    messageToRespondTo?: string; // Add field for messages that need AI responses
+}
+
+export type UpdateEvent = {
+    type: 'UPDATE';
+    value?: Partial<AIAgentContext>;
+};
+
+export type AIAgentEvent =
+    | { type: 'SEND_MESSAGE'; message: string }
+    | { type: 'INPUT_CHANGE'; value: string }
+    | { type: 'AI_RESPONSE_SUCCESS'; response: string }
+    | { type: 'AI_RESPONSE_ERROR'; error: string }
+    | { type: 'RETRY' }
+    | { type: 'CLEAR_ERROR' }
+    | { type: 'CONTINUE_MULTI_MESSAGE' }
+    | { type: 'FORCE_MULTI_MESSAGE'; message: string }
+    | { type: 'UPDATE_REGULAR_MESSAGES'; messages: any[] } // Add event for updating regular messages
+    | { type: 'ANALYZE_EXISTING_CONTEXT' } // Add event for analyzing existing conversation context
+    | { type: 'AUTO_RESPOND_TO_MESSAGE'; message: string; isAutoResponse?: boolean } // Add event for automatic responses
+    | { type: 'CONTINUE_PROCESSING' } // Add event for continuing message processing
+    | UpdateEvent;

package/src/module.tsx

@@ -0,0 +1,32 @@
+import { Feature } from '@common-stack/client-react';
+import { schema, typePolicies, dataIdFromObject } from '@messenger-box/platform-client';
+import { MESSAGE_SLOT_FILL_NAME } from '@messenger-box/core';
+import { filteredRoutes } from './compute';
+import { ChatMessageFill, ChatMessageFill2 } from './components/slot-fill/chat-message-filler';
+import { RightSidebarFill } from './components/slot-fill/right-sidebar-filler';
+
+export { ChatMessageFill, RightSidebarFill };
+export default new Feature({
+    routeConfig: filteredRoutes,
+    dataIdFromObject,
+    clientStateParams: { typeDefs: schema, typePolicies },
+    stylesInsert: ['@chatscope/chat-ui-kit-styles/dist/default/styles.min.css'],
+    componentFillPlugins: [
+        {
+            name: `${MESSAGE_SLOT_FILL_NAME}1`,
+            render: ChatMessageFill,
+        },
+        // {
+        //     name: `${MESSAGE_SLOT_FILL_NAME}2`,
+        //     render: ChatMessageFill2,
+        // },
+        {
+            name: 'inbox-with-ai-right-sidebar-1',
+            render: RightSidebarFill,
+        },
+        // {
+        //     name: 'inbox-with-ai-right-sidebar-2',
+        //     render: RightSidebarFill2,
+        // },
+    ],
+});

package/src/styles/responsive.css

@@ -0,0 +1,76 @@
+/* Mobile Responsive Improvements */
+@media (max-width: 1023px) {
+  /* Touch-friendly scrollbars */
+  .overflow-y-auto::-webkit-scrollbar {
+    width: 8px;
+  }
+  
+  .overflow-y-auto::-webkit-scrollbar-track {
+    background: transparent;
+  }
+  
+  .overflow-y-auto::-webkit-scrollbar-thumb {
+    background: #cbd5e0;
+    border-radius: 4px;
+  }
+  
+  /* Better touch targets */
+  button, a {
+    min-height: 44px;
+    min-width: 44px;
+  }
+  
+  /* Improve mobile text legibility */
+  input {
+    font-size: 16px !important; /* Prevents zoom on iOS */
+  }
+  
+  /* Better mobile spacing */
+  .inbox-mobile-padding {
+    padding-left: 12px;
+    padding-right: 12px;
+  }
+}
+
+@media (max-width: 768px) {
+  /* Very small mobile adjustments */
+  .inbox-conversation-item {
+    padding: 8px;
+  }
+  
+  /* Smaller search input on very small screens */
+  .search-input-mobile {
+    font-size: 14px;
+  }
+}
+
+/* Safe area handling for iOS devices */
+@supports (padding-top: env(safe-area-inset-top)) {
+  .inbox-container {
+    padding-top: env(safe-area-inset-top);
+  }
+}
+
+/* Smooth transitions for responsive changes */
+.responsive-transition {
+  transition: width 0.3s ease-in-out, margin 0.3s ease-in-out, padding 0.3s ease-in-out;
+}
+
+/* Better mobile drawer animations */
+.mobile-drawer-enter {
+  transform: translateY(100%);
+}
+
+.mobile-drawer-enter-active {
+  transform: translateY(0);
+  transition: transform 300ms ease-out;
+}
+
+.mobile-drawer-exit {
+  transform: translateY(0);
+}
+
+.mobile-drawer-exit-active {
+  transform: translateY(100%);
+  transition: transform 300ms ease-in;
+}