indas-ui 0.0.1 → 0.1.0

package/dist/cjs/types/approval.js

@@ -0,0 +1,22 @@
+'use client';
+"use strict";
+/**
+ * Approval Workflow Types
+ *
+ * Types for multi-level approval workflows and escalations.
+ * Supports quotation approvals, master data changes, and other approval processes.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ApprovalStatus = void 0;
+/**
+ * Approval status
+ */
+var ApprovalStatus;
+(function (ApprovalStatus) {
+    ApprovalStatus["PENDING"] = "PENDING";
+    ApprovalStatus["APPROVED"] = "APPROVED";
+    ApprovalStatus["REJECTED"] = "REJECTED";
+    ApprovalStatus["ESCALATED"] = "ESCALATED";
+    ApprovalStatus["WITHDRAWN"] = "WITHDRAWN";
+    ApprovalStatus["EXPIRED"] = "EXPIRED";
+})(ApprovalStatus || (exports.ApprovalStatus = ApprovalStatus = {}));

package/dist/cjs/types/audit.js

@@ -0,0 +1,50 @@
+'use client';
+"use strict";
+/**
+ * Audit Logging Types
+ *
+ * Enums + backend request/response types.
+ * No intermediate "BusinessAuditLog" — callers build BackendAuditLogRequest directly.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AuditAction = exports.AuditModule = void 0;
+var AuditModule;
+(function (AuditModule) {
+    AuditModule["ESTIMATION"] = "Estimation";
+    AuditModule["QUOTATION"] = "Quotation";
+    AuditModule["MASTER_DATA"] = "Master Data";
+    AuditModule["PLANNING"] = "Planning";
+    AuditModule["PROCESS"] = "Process";
+    AuditModule["MATERIAL"] = "Material";
+    AuditModule["MACHINE"] = "Machine";
+    AuditModule["APPROVAL"] = "Approval";
+    AuditModule["USER_MANAGEMENT"] = "User Management";
+    AuditModule["SETTINGS"] = "Settings";
+})(AuditModule || (exports.AuditModule = AuditModule = {}));
+var AuditAction;
+(function (AuditAction) {
+    AuditAction["CREATE"] = "Create";
+    AuditAction["READ"] = "Read";
+    AuditAction["UPDATE"] = "Update";
+    AuditAction["DELETE"] = "Delete";
+    AuditAction["EXPORT"] = "Export";
+    AuditAction["IMPORT"] = "Import";
+    AuditAction["PRINT"] = "Print";
+    AuditAction["DUPLICATE"] = "Duplicate";
+    AuditAction["SAVE_AS"] = "Save As";
+    AuditAction["APPROVE"] = "Approve";
+    AuditAction["REJECT"] = "Reject";
+    AuditAction["ESCALATE"] = "Escalate";
+    AuditAction["DELEGATE"] = "Delegate";
+    AuditAction["REQUEST_APPROVAL"] = "Request Approval";
+    AuditAction["WITHDRAW_APPROVAL"] = "Withdraw Approval";
+    AuditAction["APPLY_PLANNING"] = "Apply Planning";
+    AuditAction["MODIFY_PLANNING"] = "Modify Planning";
+    AuditAction["CLEAR_PLANNING"] = "Clear Planning";
+    AuditAction["ADD_CONTENT"] = "Add Content";
+    AuditAction["REMOVE_CONTENT"] = "Remove Content";
+    AuditAction["MODIFY_CONTENT"] = "Modify Content";
+    AuditAction["SELECT_PROCESS"] = "Select Process";
+    AuditAction["DESELECT_PROCESS"] = "Deselect Process";
+    AuditAction["MODIFY_PROCESS"] = "Modify Process";
+})(AuditAction || (exports.AuditAction = AuditAction = {}));

package/dist/cjs/types/draft.js

@@ -0,0 +1,22 @@
+'use client';
+"use strict";
+/**
+ * Draft System Types
+ *
+ * Types for auto-saving estimation work-in-progress and managing drafts.
+ * Drafts are stored securely in SQL database via C# backend (NO localStorage for sensitive data).
+ *
+ * Security: All draft data stored in backend database, not client-side storage.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DEFAULT_DRAFT_SETTINGS = void 0;
+/**
+ * Default draft settings
+ */
+exports.DEFAULT_DRAFT_SETTINGS = {
+    autoSaveEnabled: true,
+    autoSaveInterval: 30, // 30 seconds
+    draftRetentionDays: 30, // 30 days
+    showExpiryWarnings: true,
+    expiryWarningDays: 3 // Warn 3 days before expiry
+};

package/dist/cjs/types/master.js

@@ -0,0 +1,4 @@
+'use client';
+"use strict";
+// Global Master Module Types
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/types/shipper-planning.js

@@ -0,0 +1,7 @@
+'use client';
+"use strict";
+/**
+ * Shipper Planning Types
+ * Aligned with ShipperPlanningController.cs (updated 26/02/2026)
+ */
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/components/auth/ProtectedRoute.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+interface ProtectedRouteProps {
+    children: React.ReactNode;
+}
+export declare function ProtectedRoute({ children }: ProtectedRouteProps): React.JSX.Element;
+export {};

package/dist/components/auth/ProtectedRoute.js

@@ -0,0 +1,45 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { usePathname } from 'next/navigation';
+import { useModuleAuth } from '../../contexts/ModuleAuthContext.js';
+import { useDevice } from '../../contexts/DeviceContext.js';
+import { useNavigation } from '../../contexts/NavigationContext.js';
+import { getModuleRoutePath } from '../../lib/utils.js';
+import { UnauthorizedPage, MobileUnavailablePage } from './UnauthorizedPage.js';
+// Paths that always work on mobile (no MobileSupported check needed)
+const MOBILE_PUBLIC_PATHS = ['/home', '/dashboard', '/settings', '/login', '/'];
+export function ProtectedRoute({ children }) {
+    const pathname = usePathname();
+    const { hasAccess } = useModuleAuth();
+    const { isMobile } = useDevice();
+    const { groupedModules, loading } = useNavigation();
+    // Check permission access for current path
+    if (!pathname || !hasAccess(pathname)) {
+        return _jsx(UnauthorizedPage, {});
+    }
+    // Mobile gate: block modules where MobileSupported is falsy
+    if (isMobile && !loading && groupedModules.length > 0) {
+        const isPublicPath = MOBILE_PUBLIC_PATHS.some(p => pathname === p || (p !== '/' && pathname.startsWith(p + '/')));
+        if (!isPublicPath) {
+            const normalizedPath = pathname.toLowerCase();
+            let isMobileSupported = false;
+            let moduleExists = false;
+            for (const group of groupedModules) {
+                for (const mod of group.modules) {
+                    const modulePath = getModuleRoutePath(mod.ModuleName).toLowerCase();
+                    if (normalizedPath === modulePath || normalizedPath.startsWith(modulePath + '/')) {
+                        moduleExists = true;
+                        isMobileSupported = mod.MobileSupported === 1 || mod.MobileSupported === true;
+                        break;
+                    }
+                }
+                if (moduleExists)
+                    break;
+            }
+            if (moduleExists && !isMobileSupported) {
+                return _jsx(MobileUnavailablePage, {});
+            }
+        }
+    }
+    return _jsx(_Fragment, { children: children });
+}

package/dist/components/auth/UnauthorizedPage.d.ts

@@ -0,0 +1,6 @@
+interface UnauthorizedPageProps {
+    message?: string;
+}
+export declare function UnauthorizedPage({ message }: UnauthorizedPageProps): import("react").JSX.Element;
+export declare function MobileUnavailablePage(): import("react").JSX.Element;
+export {};

package/dist/components/auth/UnauthorizedPage.js

@@ -0,0 +1,15 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Lock, Monitor } from 'lucide-react';
+import { useRouter } from 'next/navigation';
+import { useTranslation } from '../../hooks/useTranslation.js';
+export function UnauthorizedPage({ message }) {
+    const router = useRouter();
+    const { t } = useTranslation();
+    return (_jsxs("div", { className: "flex flex-col items-center justify-center min-h-[50vh] p-6", children: [_jsx(Lock, { className: "w-12 h-12 text-[rgb(var(--fg-muted))] mb-4", strokeWidth: 1.5 }), _jsx("h2", { className: "text-lg font-medium text-[rgb(var(--fg-default))] mb-1", children: t('Access Restricted') }), _jsx("p", { className: "text-sm text-[rgb(var(--fg-muted))] mb-4 text-center max-w-sm", children: message || t('You don\'t have permission to view this page.') }), _jsx("button", { onClick: () => router.push('/home'), className: "text-sm text-[rgb(var(--color-primary))] hover:underline", children: t('Return to Home') })] }));
+}
+export function MobileUnavailablePage() {
+    const router = useRouter();
+    const { t } = useTranslation();
+    return (_jsxs("div", { className: "flex flex-col items-center justify-center min-h-[60vh] p-6 text-center", children: [_jsx("div", { className: "w-16 h-16 rounded-2xl bg-[rgb(var(--bg-subtle))] flex items-center justify-center mb-5", children: _jsx(Monitor, { className: "w-8 h-8 text-[rgb(var(--fg-muted))]", strokeWidth: 1.5 }) }), _jsx("h2", { className: "text-lg font-semibold text-[rgb(var(--fg-default))] mb-2", children: t('Desktop Only') }), _jsx("p", { className: "text-sm text-[rgb(var(--fg-muted))] mb-6 max-w-xs leading-relaxed", children: t('This module is optimized for desktop. Please use a larger screen for the best experience.') }), _jsx("button", { onClick: () => router.push('/home'), className: "px-5 py-2.5 text-sm font-medium rounded-lg bg-[rgb(var(--color-primary))] text-white hover:opacity-90 transition-opacity min-h-[2.75rem]", children: t('Go to Home') })] }));
+}

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

@@ -0,0 +1,2 @@
+export { ProtectedRoute } from './ProtectedRoute.js';
+export { UnauthorizedPage, MobileUnavailablePage } from './UnauthorizedPage.js';

package/dist/components/auth/index.js

@@ -0,0 +1,3 @@
+'use client';
+export { ProtectedRoute } from './ProtectedRoute.js';
+export { UnauthorizedPage, MobileUnavailablePage } from './UnauthorizedPage.js';

package/dist/components/chat/ai-messages.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Reusable chat message list with auto-scroll, message bubbles, markdown rendering,
+ * copy/edit actions, typing indicator, and optional export/share bar.
+ * Domain-specific rendering (cards, empty states) is injected via props.
+ */
+import { ReactNode } from 'react';
+import type { Message as MessageType } from '../../lib/api/ai/types.js';
+export interface SelectableItem {
+    id: string;
+    name: string;
+    num: number;
+    messageText?: string;
+    [key: string]: unknown;
+}
+interface MessagesProps {
+    messages: MessageType[];
+    isLoading?: boolean;
+    onExport?: () => void;
+    onShare?: () => void;
+    onSelectItem?: (item: SelectableItem) => void;
+    onEditMessage?: (messageId: string, newContent: string) => void;
+    onRegenerateAi?: (messageId: string) => void;
+    onFeedback?: (messageId: string, rating: 'up' | 'down' | null) => void;
+    /** Custom bot avatar element (defaults to generic Bot icon) */
+    botAvatar?: ReactNode;
+    /** Custom empty state when no messages (defaults to nothing) */
+    emptyState?: ReactNode;
+    /** Custom renderer for bot message content. Return null to fall back to markdown. */
+    renderBotContent?: (message: MessageType, onSelectItem?: (item: SelectableItem) => void) => ReactNode | null;
+}
+export declare function Messages({ messages, isLoading, onExport, onShare, onSelectItem, onEditMessage, onRegenerateAi, onFeedback, botAvatar, emptyState, renderBotContent }: MessagesProps): import("react").JSX.Element;
+export {};

package/dist/components/chat/ai-messages.js

@@ -0,0 +1,265 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * Reusable chat message list with auto-scroll, message bubbles, markdown rendering,
+ * copy/edit actions, typing indicator, and optional export/share bar.
+ * Domain-specific rendering (cards, empty states) is injected via props.
+ */
+import { useEffect, useRef, useState, useCallback } from 'react';
+import { cn } from '../../lib/utils.js';
+import { User, Copy, Check, Download, Share2, Pencil, Bot, RotateCcw, ThumbsUp, ThumbsDown } from 'lucide-react';
+import ReactMarkdown from 'react-markdown';
+import remarkGfm from 'remark-gfm';
+// Individual Message Bubble Component
+function Message({ message, onSelectItem, onEditMessage, onRegenerateAi, onFeedback, botAvatar, renderBotContent }) {
+    const isUser = message.role === 'user';
+    const [copied, setCopied] = useState(false);
+    const [feedback, setFeedback] = useState(message.feedback ?? null);
+    const [isEditing, setIsEditing] = useState(false);
+    const [editText, setEditText] = useState('');
+    const editTextareaRef = useRef(null);
+    const handleCopy = async () => {
+        await navigator.clipboard.writeText(message.content);
+        setCopied(true);
+        setTimeout(() => setCopied(false), 2000);
+    };
+    const handleStartEdit = useCallback(() => {
+        setEditText(message.content);
+        setIsEditing(true);
+    }, [message.content]);
+    const handleCancelEdit = useCallback(() => {
+        setIsEditing(false);
+        setEditText('');
+    }, []);
+    const handleSaveEdit = useCallback(() => {
+        const trimmed = editText.trim();
+        if (!trimmed) {
+            handleCancelEdit();
+            return;
+        }
+        onEditMessage?.(message.id, trimmed);
+        setIsEditing(false);
+        setEditText('');
+    }, [editText, message.id, onEditMessage, handleCancelEdit]);
+    const handleEditKeyDown = useCallback((e) => {
+        if (e.key === 'Escape') {
+            handleCancelEdit();
+        }
+        else if (e.key === 'Enter' && !e.shiftKey) {
+            e.preventDefault();
+            handleSaveEdit();
+        }
+    }, [handleCancelEdit, handleSaveEdit]);
+    // Regenerate — re-send the same content via the edit flow (cascades delete after this message, re-posts)
+    const handleRegenerate = useCallback(() => {
+        if (onEditMessage && message.content) {
+            onEditMessage(message.id, message.content);
+        }
+    }, [onEditMessage, message.id, message.content]);
+    const handleRegenerateAi = useCallback(() => {
+        onRegenerateAi?.(message.id);
+    }, [onRegenerateAi, message.id]);
+    const handleFeedback = useCallback((rating) => {
+        const next = feedback === rating ? null : rating;
+        setFeedback(next);
+        onFeedback?.(message.id, next);
+    }, [feedback, onFeedback, message.id]);
+    // Claude-style short timestamp: "Apr 19" for older, "2:34 PM" for today
+    const formattedTimestamp = (() => {
+        const d = message.timestamp instanceof Date ? message.timestamp : new Date(message.timestamp);
+        if (isNaN(d.getTime()))
+            return '';
+        const now = new Date();
+        const sameDay = d.getFullYear() === now.getFullYear() && d.getMonth() === now.getMonth() && d.getDate() === now.getDate();
+        if (sameDay) {
+            return d.toLocaleTimeString(undefined, { hour: 'numeric', minute: '2-digit' });
+        }
+        return d.toLocaleDateString(undefined, { month: 'short', day: 'numeric' });
+    })();
+    // Auto-resize and focus edit textarea
+    useEffect(() => {
+        if (isEditing && editTextareaRef.current) {
+            const ta = editTextareaRef.current;
+            ta.style.height = 'auto';
+            ta.style.height = `${ta.scrollHeight}px`;
+            ta.focus();
+            ta.setSelectionRange(ta.value.length, ta.value.length);
+        }
+    }, [isEditing]);
+    // Try custom bot content renderer first
+    const customBotContent = !isUser && renderBotContent ? renderBotContent(message, onSelectItem) : null;
+    return (_jsxs("div", { "data-message-id": message.id, "data-message-role": message.role, className: cn('flex gap-4 group animate-[popIn_0.25s_cubic-bezier(0.175,0.885,0.32,1.05)]', isUser && 'flex-row-reverse'), children: [_jsx("div", { className: cn('w-8 h-8 shrink-0 rounded-full flex items-center justify-center', isUser
+                    ? 'bg-[rgb(var(--color-primary))]'
+                    : 'bg-[rgb(var(--bg-subtle))] border border-[rgb(var(--bd-default))]'), children: isUser ? (_jsx(User, { className: "w-4 h-4 text-white" })) : (botAvatar || _jsx(Bot, { className: "w-4 h-4 text-[rgb(var(--fg-muted))]" })) }), _jsxs("div", { className: cn('flex-1', isUser ? 'max-w-[85%] flex flex-col items-end' : 'max-w-[95%]'), children: [_jsx("div", { className: "relative", children: !isUser && !isEditing && customBotContent ? (_jsx("div", { className: "break-words text-sm leading-relaxed text-[rgb(var(--fg-default))] max-w-xl", children: customBotContent })) : (_jsx("div", { className: cn('inline-block break-words', isEditing
+                                ? 'px-3 py-2 rounded-xl bg-[rgb(var(--bg-surface))] border-2 border-[rgb(var(--color-primary))] w-full'
+                                : cn('px-4 py-3', isUser
+                                    ? 'rounded-[18px_4px_18px_18px] bg-[rgb(var(--color-primary))] text-white animate-[sendBubble_0.22s_ease-out]'
+                                    : 'rounded-[4px_18px_18px_18px] bg-[rgb(var(--bg-surface))] border border-[rgb(var(--bd-default))] text-[rgb(var(--fg-default))]')), children: isEditing ? (
+                            /* Edit Mode */
+                            _jsxs("div", { children: [_jsx("textarea", { ref: editTextareaRef, value: editText, onChange: (e) => {
+                                            setEditText(e.target.value);
+                                            // Auto-resize
+                                            e.target.style.height = 'auto';
+                                            e.target.style.height = `${e.target.scrollHeight}px`;
+                                        }, onKeyDown: handleEditKeyDown, className: "w-full bg-transparent text-[rgb(var(--fg-default))] text-sm leading-relaxed resize-none outline-none min-h-[40px]" }), _jsxs("div", { className: "flex gap-2 justify-end mt-2", children: [_jsx("button", { onClick: handleCancelEdit, className: "px-3 py-1.5 rounded-lg text-xs font-semibold bg-[rgb(var(--bg-subtle))] border border-[rgb(var(--bd-default))] text-[rgb(var(--fg-muted))] hover:bg-[rgb(var(--bg-app))] hover:text-[rgb(var(--fg-default))] transition-all", children: "Cancel" }), _jsx("button", { onClick: handleSaveEdit, className: "px-3 py-1.5 rounded-lg text-xs font-semibold bg-[rgb(var(--color-primary))] text-white hover:opacity-90 transition-all", children: "Save & Resend" })] })] })) : (
+                            /* Message Content */
+                            _jsx("div", { className: "text-sm leading-relaxed", children: isUser ? (_jsx("div", { className: "whitespace-pre-wrap", children: message.content })) : (_jsx("div", { className: "markdown-content text-left", children: _jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], components: {
+                                            p: ({ children }) => _jsx("p", { className: "mb-2 last:mb-0 text-left", children: children }),
+                                            ul: ({ children }) => _jsx("ul", { className: "list-disc list-inside mb-2 space-y-1 text-left", children: children }),
+                                            ol: ({ children }) => _jsx("ol", { className: "list-decimal list-inside mb-2 space-y-1 text-left", children: children }),
+                                            li: ({ children }) => _jsx("li", { className: "ml-4 text-left", children: children }),
+                                            strong: ({ children }) => _jsx("strong", { className: "font-semibold", children: children }),
+                                            em: ({ children }) => _jsx("em", { className: "italic", children: children }),
+                                            a: ({ href, children }) => (_jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", className: "text-[rgb(var(--color-primary))] underline hover:opacity-80", children: children })),
+                                            code: ({ children }) => (_jsx("code", { className: "bg-[rgb(var(--bg-app))] px-1.5 py-0.5 rounded text-xs font-mono", children: children })),
+                                            pre: ({ children }) => (_jsx("pre", { className: "bg-[rgb(var(--bg-app))] p-3 rounded-lg overflow-x-auto mb-2 text-xs", children: children })),
+                                            blockquote: ({ children }) => (_jsx("blockquote", { className: "border-l-4 border-[rgb(var(--bd-default))] pl-4 italic my-2", children: children })),
+                                            h1: ({ children }) => _jsx("h1", { className: "text-xl font-bold mb-2", children: children }),
+                                            h2: ({ children }) => _jsx("h2", { className: "text-lg font-bold mb-2", children: children }),
+                                            h3: ({ children }) => _jsx("h3", { className: "text-base font-bold mb-2", children: children }),
+                                            img: ({ src, alt }) => {
+                                                let normalizedSrc = src || '';
+                                                const m = normalizedSrc.match(/^\/?(?:images\/)?Contents\/(.+)$/i);
+                                                if (m) {
+                                                    normalizedSrc = '/Contents/' + m[1];
+                                                }
+                                                return (_jsx("img", { src: normalizedSrc, alt: alt || '', className: "w-32 h-auto rounded-lg my-2 block", loading: "lazy", onError: (e) => {
+                                                        const cur = e.currentTarget.src;
+                                                        if (cur.includes('.jpg') && !cur.includes('_tried_png')) {
+                                                            e.currentTarget.src = cur.replace('.jpg', '.png') + '?_tried_png=1';
+                                                        }
+                                                        else if (!cur.includes('Rectangular')) {
+                                                            e.currentTarget.src = '/Contents/Rectangular.jpg';
+                                                        }
+                                                    } }));
+                                            },
+                                        }, children: (() => {
+                                            let text = message.content;
+                                            const jsonStart = text.search(/\{"(?:source|ui_data_id|ui_state)":/);
+                                            if (jsonStart >= 0)
+                                                text = text.substring(0, jsonStart).trim();
+                                            let processed = text
+                                                // Repair multi-line markdown images: `![\n...\n](url)` → `![](url)` (LLM sometimes splits syntax across lines)
+                                                .replace(/!\[([^\]]*)\]\s*\n+\s*\(([^)]+)\)/g, (_, alt, url) => `![${alt}](${url})`)
+                                                .replace(/!\[\s*\n+\s*\]\(([^)]+)\)/g, (_, url) => `![](${url})`)
+                                                .replace(/^(.+?)\s*(?:[—–-]{1,3}|[.:])?\s*(?:[Ii]mage:\s*)?(\/?(?:images\/)?Contents\/[^\n]+?\.(?:jpg|png))\s*$/gm, (_, alt, path) => `![${alt.trim()}](${path.trim()})`)
+                                                .replace(/!\[([^\]]*)\]\(([^)]+)\)/g, (_, alt, url) => `![${alt}](${url.replace(/ /g, '%20')})`);
+                                            const normalizeImgKey = (url) => {
+                                                const cleaned = decodeURIComponent(url.trim()).replace(/\s+/g, '');
+                                                const m = cleaned.match(/^\/?(?:images\/)?Contents\/(.+)$/i);
+                                                return (m ? `/Contents/${m[1]}` : cleaned).toLowerCase();
+                                            };
+                                            const seenImgUrls = new Set();
+                                            processed = processed.replace(/!\[([^\]]*)\]\(([^)]+)\)/g, (full, _alt, url) => {
+                                                const key = normalizeImgKey(url);
+                                                if (seenImgUrls.has(key))
+                                                    return '';
+                                                seenImgUrls.add(key);
+                                                return full;
+                                            });
+                                            return processed;
+                                        })() }) })) })) })) }), !isEditing && (_jsxs("div", { className: cn('flex items-center gap-2 mt-1 opacity-0 group-hover:opacity-100 transition-opacity duration-200', isUser ? 'justify-end' : 'justify-start'), children: [formattedTimestamp && (_jsx("span", { className: "text-[0.7rem] text-[rgb(var(--fg-muted))]/70 select-none", children: formattedTimestamp })), isUser && onEditMessage && (_jsx("button", { onClick: handleRegenerate, className: "w-7 h-7 rounded-md flex items-center justify-center text-[rgb(var(--fg-muted))] hover:text-[rgb(var(--fg-default))] hover:bg-[rgb(var(--bg-subtle))] transition-colors", "aria-label": "Regenerate response", title: "Regenerate", children: _jsx(RotateCcw, { className: "w-3.5 h-3.5" }) })), isUser && onEditMessage && (_jsx("button", { onClick: handleStartEdit, className: "w-7 h-7 rounded-md flex items-center justify-center text-[rgb(var(--fg-muted))] hover:text-[rgb(var(--fg-default))] hover:bg-[rgb(var(--bg-subtle))] transition-colors", "aria-label": "Edit message", title: "Edit", children: _jsx(Pencil, { className: "w-3.5 h-3.5" }) })), _jsx("button", { onClick: handleCopy, className: "w-7 h-7 rounded-md flex items-center justify-center text-[rgb(var(--fg-muted))] hover:text-[rgb(var(--fg-default))] hover:bg-[rgb(var(--bg-subtle))] transition-colors", "aria-label": "Copy message", title: "Copy", children: copied ? (_jsx(Check, { className: "w-3.5 h-3.5" })) : (_jsx(Copy, { className: "w-3.5 h-3.5" })) }), !isUser && onRegenerateAi && (_jsx("button", { onClick: handleRegenerateAi, className: "w-7 h-7 rounded-md flex items-center justify-center text-[rgb(var(--fg-muted))] hover:text-[rgb(var(--fg-default))] hover:bg-[rgb(var(--bg-subtle))] transition-colors", "aria-label": "Regenerate response", title: "Regenerate", children: _jsx(RotateCcw, { className: "w-3.5 h-3.5" }) })), !isUser && (_jsxs(_Fragment, { children: [_jsx("button", { onClick: () => handleFeedback('up'), className: "w-7 h-7 rounded-md flex items-center justify-center text-[rgb(var(--fg-muted))] hover:text-[rgb(var(--fg-default))] hover:bg-[rgb(var(--bg-subtle))] transition-colors", "aria-label": "Good response", title: "Good response", children: _jsx(ThumbsUp, { className: "w-3.5 h-3.5", fill: feedback === 'up' ? 'currentColor' : 'none' }) }), _jsx("button", { onClick: () => handleFeedback('down'), className: "w-7 h-7 rounded-md flex items-center justify-center text-[rgb(var(--fg-muted))] hover:text-[rgb(var(--fg-default))] hover:bg-[rgb(var(--bg-subtle))] transition-colors", "aria-label": "Bad response", title: "Bad response", children: _jsx(ThumbsDown, { className: "w-3.5 h-3.5", fill: feedback === 'down' ? 'currentColor' : 'none' }) })] })), !isUser && message.tokens && process.env.NEXT_PUBLIC_SHOW_TOKENS === 'true' && (_jsxs("span", { className: "text-[0.65rem] text-[rgb(var(--fg-muted))]/70 font-mono select-none ml-1", children: ["P: ", message.tokens.prompt.toLocaleString(), "  R: ", message.tokens.completion.toLocaleString(), "  T: ", message.tokens.total.toLocaleString()] }))] }))] })] }));
+}
+// Synthia thinking phrases — the fun ones
+const SYNTHIA_THINKING = [
+    'Accomplishing', 'Actioning', 'Actualizing', 'Architecting', 'Baking', 'Beaming', 'Beboppin\'',
+    'Befuddling', 'Billowing', 'Blanching', 'Bloviating', 'Boogieing', 'Boondoggling', 'Booping', 'Bootstrapping', 'Brewing',
+    'Bunning', 'Burrowing', 'Calculating', 'Canoodling', 'Caramelizing', 'Cascading', 'Catapulting', 'Cerebrating', 'Channeling',
+    'Channelling', 'Choreographing', 'Churning', 'Coalescing', 'Cogitating', 'Combobulating', 'Composing', 'Computing',
+    'Concocting', 'Considering', 'Contemplating', 'Cooking', 'Crafting', 'Creating', 'Crunching', 'Crystallizing', 'Cultivating',
+    'Deciphering', 'Deliberating', 'Determining', 'Dilly-dallying', 'Doing', 'Doodling', 'Drizzling', 'Ebbing',
+    'Effecting', 'Elucidating', 'Embellishing', 'Enchanting', 'Envisioning', 'Evaporating', 'Fermenting', 'Fiddle-faddling',
+    'Finagling', 'Flambéing', 'Flibbertigibbeting', 'Flowing', 'Flummoxing', 'Fluttering', 'Forging', 'Forming', 'Frolicking',
+    'Frosting', 'Gallivanting', 'Galloping', 'Garnishing', 'Generating', 'Gesticulating', 'Germinating', 'Gitifying', 'Grooving',
+    'Gusting', 'Harmonizing', 'Hashing', 'Hatching', 'Herding', 'Honking', 'Hullaballooing', 'Hyperspacing', 'Ideating', 'Imagining',
+    'Improvising', 'Incubating', 'Inferring', 'Infusing', 'Ionizing', 'Jitterbugging', 'Julienning', 'Kneading', 'Leavening',
+    'Levitating', 'Lollygagging', 'Manifesting', 'Marinating', 'Meandering', 'Metamorphosing', 'Misting', 'Moonwalking', 'Moseying',
+    'Mulling', 'Mustering', 'Musing', 'Nebulizing', 'Nesting', 'Newspapering', 'Noodling', 'Nucleating', 'Orbiting', 'Orchestrating',
+    'Osmosing', 'Perambulating', 'Percolating', 'Perusing', 'Philosophising', 'Photosynthesizing', 'Pollinating', 'Pondering',
+    'Pontificating', 'Pouncing', 'Precipitating', 'Prestidigitating', 'Processing', 'Proofing', 'Propagating', 'Puttering',
+    'Puzzling', 'Quantumizing', 'Razzle-dazzling', 'Razzmatazzing', 'Recombobulating', 'Reticulating', 'Roosting', 'Ruminating',
+    'Sautéing', 'Scampering', 'Schlepping', 'Scurrying', 'Seasoning', 'Shenaniganing', 'Shimmying', 'Simmering', 'Skedaddling',
+    'Sketching', 'Slithering', 'Smooshing', 'Sock-hopping', 'Spelunking', 'Spinning', 'Sprouting', 'Stewing', 'Sublimating',
+    'Swirling', 'Swooping', 'Symbioting', 'Synthesizing', 'Tempering', 'Thinking', 'Thundering', 'Tinkering', 'Tomfoolering',
+    'Topsy-turvying', 'Transfiguring', 'Transmuting', 'Twisting', 'Undulating', 'Unfurling', 'Unravelling', 'Vibing', 'Waddling',
+    'Wandering', 'Warping', 'Whatchamacalliting', 'Whirlpooling', 'Whirring', 'Whisking', 'Wibbling', 'Working', 'Wrangling',
+    'Zesting', 'Zigzagging',
+];
+// Contextual first phrase based on what the user asked — each bucket rotates randomly
+const THINKING_CONTEXT = [
+    { test: /\b(cost|costing|estimate|pricing|quote|quotation)\b/i, phrases: ['Crunching', 'Tallying numbers', 'Sharpening pencils', 'Doing math'] },
+    { test: /\b(plant|unit|factory|production)\b/i, phrases: ['Spooling plants', 'Walking floor', 'Counting machines', 'Booting units'] },
+    { test: /\b(customer|client|party|lead)\b/i, phrases: ['Dialing', 'Flipping rolodex', 'Pulling clients', 'Sleuthing leads'] },
+    { test: /\b(paper|gsm|quality|mill|material)\b/i, phrases: ['Weighing GSM', 'Sniffing mills', 'Stacking reels', 'Sorting paper'] },
+    { test: /\b(color|colour|printing|print)\b/i, phrases: ['Mixing inks', 'Calibrating', 'Loading plates', 'Tuning press'] },
+    { test: /\b(corrugat|ply|flute|liner)\b/i, phrases: ['Stacking flutes', 'Counting plies', 'Folding liners', 'Fluting'] },
+    { test: /\b(freight|delivery|location|ship)\b/i, phrases: ['Plotting routes', 'Loading trucks', 'Pinging logistics', 'Shipping'] },
+    { test: /\b(process|lamination|varnish|emboss|foil)\b/i, phrases: ['Heating foil', 'Queueing finishes', 'Laminating', 'Lining post-press'] },
+    { test: /\b(save|confirm|generate|finalize)\b/i, phrases: ['Locking it in', 'Sealing deal', 'Stamping', 'Finalizing'] },
+    { test: /\b(login|activity|audit|log|who)\b/i, phrases: ['Reading trail', 'Pulling logs', 'Tracing steps', 'Snooping'] },
+    { test: /\b(enquir|inquir|estimation|quotation|how many|count|list|report|status)\b/i, phrases: ['Pulling reports', 'Counting rows', 'Scanning books', 'Fetching'] },
+];
+function getContextualPhrase(lastUserMsg) {
+    if (lastUserMsg) {
+        for (const ctx of THINKING_CONTEXT) {
+            if (ctx.test.test(lastUserMsg)) {
+                return ctx.phrases[Math.floor(Math.random() * ctx.phrases.length)];
+            }
+        }
+    }
+    return SYNTHIA_THINKING[Math.floor(Math.random() * SYNTHIA_THINKING.length)];
+}
+// Typing Indicator — contextual first phrase, fun word on second rotation, max 2
+function TypingIndicator({ lastUserMessage }) {
+    const [phrase, setPhrase] = useState(() => getContextualPhrase(lastUserMessage));
+    const rotatedRef = useRef(false);
+    useEffect(() => {
+        rotatedRef.current = false;
+        setPhrase(getContextualPhrase(lastUserMessage));
+        const timer = setTimeout(() => {
+            if (!rotatedRef.current) {
+                rotatedRef.current = true;
+                setPhrase(SYNTHIA_THINKING[Math.floor(Math.random() * SYNTHIA_THINKING.length)]);
+            }
+        }, 4000);
+        return () => clearTimeout(timer);
+    }, [lastUserMessage]);
+    return (_jsx("div", { className: "flex justify-start", children: _jsxs("div", { className: "inline-flex items-center gap-2 px-4 py-2", "aria-label": "AI typing", children: [_jsx("span", { className: "w-2 h-2 bg-[rgb(var(--color-primary))] rounded-full animate-bounce [animation-delay:-0.3s]" }), _jsx("span", { className: "w-2 h-2 bg-[rgb(var(--color-primary))] rounded-full animate-bounce [animation-delay:-0.15s]" }), _jsx("span", { className: "w-2 h-2 bg-[rgb(var(--color-primary))] rounded-full animate-bounce" }), _jsxs("span", { className: "text-sm text-[rgb(var(--fg-muted))] animate-pulse ml-1", children: [phrase, "..."] })] }) }));
+}
+// Main Messages Container
+export function Messages({ messages, isLoading = false, onExport, onShare, onSelectItem, onEditMessage, onRegenerateAi, onFeedback, botAvatar, emptyState, renderBotContent }) {
+    const bottomRef = useRef(null);
+    const [fadeKey, setFadeKey] = useState(0);
+    const prevFirstMsgIdRef = useRef(null);
+    // Detect conversation switch (first message ID changes = different conversation loaded)
+    useEffect(() => {
+        const firstId = messages.length > 0 ? messages[0].id : null;
+        if (firstId && prevFirstMsgIdRef.current && firstId !== prevFirstMsgIdRef.current) {
+            setFadeKey(k => k + 1);
+        }
+        prevFirstMsgIdRef.current = firstId;
+    }, [messages]);
+    // Auto-scroll to bottom when messages update
+    useEffect(() => {
+        bottomRef.current?.scrollIntoView({ behavior: 'smooth' });
+    }, [messages.length, isLoading]);
+    // Empty State
+    if (messages.length === 0 && !isLoading) {
+        if (emptyState)
+            return _jsx(_Fragment, { children: emptyState });
+        return null;
+    }
+    return (_jsxs("div", { className: "h-full flex flex-col", children: [messages.length > 0 && (onExport || onShare) && (_jsxs("div", { className: "border-b border-[rgb(var(--bd-default))] px-4 py-2 flex items-center justify-between bg-[rgb(var(--bg-surface))]", children: [process.env.NEXT_PUBLIC_SHOW_TOKENS === 'true' ? (() => {
+                        const totals = messages.reduce((acc, m) => {
+                            if (m.tokens) {
+                                acc.prompt += m.tokens.prompt;
+                                acc.completion += m.tokens.completion;
+                                acc.total += m.tokens.total;
+                            }
+                            return acc;
+                        }, { prompt: 0, completion: 0, total: 0 });
+                        if (totals.total === 0)
+                            return _jsx("div", {});
+                        return (_jsxs("span", { className: "text-[0.65rem] text-[rgb(var(--fg-muted))] font-mono", children: ["P:", totals.prompt.toLocaleString(), " \u00B7 C:", totals.completion.toLocaleString(), " \u00B7 T:", totals.total.toLocaleString(), " \u00B7 ", messages.filter(m => m.tokens).length, " calls"] }));
+                    })() : _jsx("div", {}), _jsxs("div", { className: "flex gap-2", children: [onExport && (_jsxs("button", { onClick: onExport, className: "flex items-center gap-2 px-3 py-1.5 text-sm text-[rgb(var(--fg-muted))] hover:text-[rgb(var(--fg-default))] hover:bg-[rgb(var(--bg-subtle))] rounded-lg transition-colors", children: [_jsx(Download, { className: "w-4 h-4" }), "Export"] })), onShare && (_jsxs("button", { onClick: onShare, className: "flex items-center gap-2 px-3 py-1.5 text-sm text-[rgb(var(--fg-muted))] hover:text-[rgb(var(--fg-default))] hover:bg-[rgb(var(--bg-subtle))] rounded-lg transition-colors", children: [_jsx(Share2, { className: "w-4 h-4" }), "Share"] }))] })] })), _jsx("div", { className: "flex-1 overflow-y-auto", children: _jsxs("div", { className: "max-w-5xl mx-auto px-3 sm:px-4 py-6 space-y-6 animate-[fadeInUp_0.28s_ease-out]", children: [messages.map((message) => (_jsx(Message, { message: message, onSelectItem: onSelectItem, onEditMessage: onEditMessage, onRegenerateAi: onRegenerateAi, onFeedback: onFeedback, botAvatar: botAvatar, renderBotContent: renderBotContent }, message.id))), isLoading && _jsx(TypingIndicator, { lastUserMessage: messages.filter(m => m.role === 'user').at(-1)?.content }), _jsx("div", { ref: bottomRef })] }, fadeKey) })] }));
+}

package/dist/components/chat/chat-prompt-navigator.d.ts

@@ -0,0 +1,9 @@
+import type { Message } from '../../lib/api/ai/types.js';
+interface ChatPromptNavigatorProps {
+    messages: Message[];
+    scrollContainer: () => HTMLElement | null;
+    /** Module display name (Synthia / ParkBuddy / Baghbadi / etc.) for the bot toggle label. */
+    moduleName?: string;
+}
+export declare function ChatPromptNavigator({ messages, scrollContainer, moduleName }: ChatPromptNavigatorProps): import("react").JSX.Element;
+export {};