indas-ui 0.0.1 → 0.1.1

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

@@ -0,0 +1,5 @@
+export { Messages } from './ai-messages.js';
+export type { SelectableItem } from './ai-messages.js';
+export { MultimodalInput } from './multimodal-input.js';
+export { ChatPromptNavigator } from './chat-prompt-navigator.js';
+export type { Message, Conversation, UIDataEntry, UIDataItem, TokenUsage } from '../../lib/api/ai/types.js';

package/dist/components/chat/index.js

@@ -0,0 +1,13 @@
+'use client';
+// Chat Components - Centralized exports
+//
+// Only the backend-agnostic pieces are exported. `Chat` itself is deliberately left out: it is
+// bound to Estimo's stack (next-auth's useSession, the /api/synthia endpoints in lib/api/ai/chat,
+// and Estimo's alert and language contexts), so a host app on a different backend cannot use it.
+// `Messages` and `MultimodalInput` take everything they render as props and so travel anywhere.
+//
+// Hosts that want the full assembly compose it themselves: SidePanel (from 'indas-ui/layout') for
+// the conversation rail, Messages for the transcript, MultimodalInput for the composer.
+export { Messages } from './ai-messages.js';
+export { MultimodalInput } from './multimodal-input.js';
+export { ChatPromptNavigator } from './chat-prompt-navigator.js';

package/dist/components/chat/multimodal-input.d.ts

@@ -0,0 +1,12 @@
+interface MultimodalInputProps {
+    onSubmit: (text: string, files?: File[]) => void;
+    onStop?: () => void;
+    isLoading?: boolean;
+    placeholder?: string;
+    allowFileUpload?: boolean;
+    compact?: boolean;
+    disabled?: boolean;
+    disabledReason?: string;
+}
+export declare function MultimodalInput({ onSubmit, onStop, isLoading, placeholder, allowFileUpload, compact, disabled, disabledReason }: MultimodalInputProps): import("react").JSX.Element;
+export {};

package/dist/components/chat/multimodal-input.js

@@ -0,0 +1,116 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * Multimodal Input Component
+ * Chat input with auto-expanding textarea, file upload, and voice input
+ */
+import { useState, useRef, useEffect, useCallback } from 'react';
+import { Send, Paperclip, Mic, MicOff, X, FileIcon, Image as ImageIcon } from 'lucide-react';
+import { cn } from '../../lib/utils.js';
+import { useOptionalLanguage } from '../../contexts/LanguageContext.js';
+export function MultimodalInput({ onSubmit, onStop, isLoading = false, placeholder = 'Send a message...', allowFileUpload = true, compact = false, disabled = false, disabledReason }) {
+    // Optional: the composer is exported for host apps that have no LanguageProvider, and falls
+    // back to the English source text rather than throwing.
+    const { t } = useOptionalLanguage();
+    const [input, setInput] = useState('');
+    const [files, setFiles] = useState([]);
+    const [isListening, setIsListening] = useState(false);
+    const textareaRef = useRef(null);
+    const fileInputRef = useRef(null);
+    const recognitionRef = useRef(null);
+    // Voice input support check (must be in state to survive SSR hydration)
+    const [speechSupported, setSpeechSupported] = useState(false);
+    useEffect(() => {
+        setSpeechSupported(typeof window !== 'undefined' &&
+            !!(window.SpeechRecognition || window.webkitSpeechRecognition));
+    }, []);
+    const handleVoiceInput = useCallback(() => {
+        const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
+        if (!SpeechRecognition)
+            return;
+        if (isListening) {
+            recognitionRef.current?.stop();
+            setIsListening(false);
+            return;
+        }
+        // Fresh instance every click — reusing a stopped instance throws InvalidStateError
+        const recognition = new SpeechRecognition();
+        recognition.continuous = false;
+        recognition.interimResults = false;
+        recognition.lang = 'en-IN';
+        recognition.onresult = (event) => {
+            const transcript = event.results[0]?.[0]?.transcript;
+            if (transcript) {
+                setInput(prev => prev + (prev ? ' ' : '') + transcript.trim());
+            }
+            setIsListening(false);
+            recognitionRef.current = null;
+        };
+        recognition.onerror = (event) => {
+            setIsListening(false);
+            recognitionRef.current = null;
+        };
+        recognition.onend = () => {
+            setIsListening(false);
+            recognitionRef.current = null;
+        };
+        recognitionRef.current = recognition;
+        try {
+            recognition.start();
+            setIsListening(true);
+        }
+        catch {
+            setIsListening(false);
+            recognitionRef.current = null;
+        }
+    }, [isListening]);
+    // Cleanup on unmount
+    useEffect(() => {
+        return () => { recognitionRef.current?.abort(); };
+    }, []);
+    // Auto-focus textarea on mount
+    useEffect(() => {
+        const timer = setTimeout(() => { textareaRef.current?.focus(); }, 100);
+        return () => clearTimeout(timer);
+    }, []);
+    // Auto-resize textarea
+    useEffect(() => {
+        if (textareaRef.current) {
+            textareaRef.current.style.height = 'auto';
+            textareaRef.current.style.height = `${textareaRef.current.scrollHeight}px`;
+        }
+    }, [input]);
+    const handleSubmit = () => {
+        if (disabled)
+            return;
+        if (!input.trim() && files.length === 0)
+            return;
+        onSubmit(input, files.length > 0 ? files : undefined);
+        setInput('');
+        setFiles([]);
+        if (textareaRef.current) {
+            textareaRef.current.style.height = 'auto';
+            textareaRef.current.focus();
+        }
+    };
+    const handleKeyDown = (e) => {
+        if (e.key === 'Enter' && !e.shiftKey) {
+            e.preventDefault();
+            handleSubmit();
+        }
+    };
+    const handleFileSelect = (e) => {
+        const selectedFiles = Array.from(e.target.files || []);
+        setFiles(prev => [...prev, ...selectedFiles]);
+    };
+    const removeFile = (index) => {
+        setFiles(prev => prev.filter((_, i) => i !== index));
+    };
+    return (_jsx("div", { className: cn("bg-[rgb(var(--bg-surface))] shrink-0", compact ? "px-1 py-1" : "border-t border-[rgb(var(--bd-default))] px-4 py-2.5"), children: _jsxs("div", { className: "max-w-3xl mx-auto", children: [disabled && disabledReason && (_jsxs("div", { className: "mb-2 px-3 py-2 rounded-lg bg-amber-500/10 border border-amber-500/30 text-xs text-amber-700 dark:text-amber-400 flex items-center gap-2", children: [_jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "shrink-0", children: [_jsx("circle", { cx: "12", cy: "12", r: "10" }), _jsx("line", { x1: "12", y1: "8", x2: "12", y2: "12" }), _jsx("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })] }), _jsx("span", { children: disabledReason })] })), files.length > 0 && (_jsx("div", { className: "flex flex-wrap gap-2 mb-3", children: files.map((file, index) => (_jsxs("div", { className: "flex items-center gap-2 px-3 py-2 bg-[rgb(var(--bg-app))] border border-[rgb(var(--bd-default))] rounded-lg text-sm", children: [file.type.startsWith('image/') ? (_jsx(ImageIcon, { className: "w-4 h-4 text-[rgb(var(--fg-muted))]" })) : (_jsx(FileIcon, { className: "w-4 h-4 text-[rgb(var(--fg-muted))]" })), _jsx("span", { className: "text-[rgb(var(--fg-default))] truncate max-w-[150px]", children: file.name }), _jsx("button", { onClick: () => removeFile(index), className: "text-[rgb(var(--fg-muted))] hover:text-[rgb(var(--fg-default))] transition-colors", children: _jsx(X, { className: "w-3 h-3" }) })] }, index))) })), _jsxs("div", { className: cn("relative flex items-center gap-1 bg-[rgb(var(--bg-app))]/60 backdrop-blur-xl border border-[rgb(var(--bd-default))] shadow-lg transition-all duration-250 focus-within:border-[rgb(var(--color-primary))] focus-within:shadow-[0_0_0_4px_rgb(var(--color-primary)/0.12),0_20px_25px_-5px_rgba(0,0,0,0.15)] focus-within:-translate-y-px", compact ? "rounded-xl p-1.5" : "rounded-2xl p-2.5"), children: [allowFileUpload && (_jsxs(_Fragment, { children: [_jsx("input", { ref: fileInputRef, type: "file", multiple: true, accept: "image/*,application/pdf,.doc,.docx,.txt", onChange: handleFileSelect, className: "hidden" }), _jsx("button", { onClick: () => fileInputRef.current?.click(), className: "shrink-0 !min-h-0 w-9 h-9 rounded-lg flex items-center justify-center transition-colors text-[rgb(var(--fg-muted))] hover:text-[rgb(var(--fg-default))] hover:bg-[rgb(var(--bg-subtle))]", "aria-label": "Attach file", children: _jsx(Paperclip, { className: "w-4 h-4" }) })] })), _jsx("textarea", { ref: textareaRef, "data-chat-input": true, value: input, onChange: (e) => setInput(e.target.value), onKeyDown: handleKeyDown, placeholder: disabled ? t('Conversation closed — start a new chat')
+                                : isListening ? t('Listening...')
+                                    : placeholder, disabled: isListening || disabled, autoFocus: !disabled, rows: 1, className: cn('flex-1 bg-transparent text-[rgb(var(--fg-default))] placeholder:text-[rgb(var(--fg-muted))]', 'resize-none outline-none text-sm', compact ? 'px-2 py-1.5 max-h-[120px]' : 'px-3 py-2.5 max-h-[200px]', 'overflow-y-auto', disabled && 'cursor-not-allowed') }), speechSupported && (_jsx("button", { onClick: handleVoiceInput, className: cn('shrink-0 !min-h-0 w-9 h-9 rounded-lg flex items-center justify-center transition-colors', isListening
+                                ? 'text-red-500 bg-red-500/10 animate-pulse'
+                                : 'text-[rgb(var(--fg-muted))] hover:text-[rgb(var(--fg-default))] hover:bg-[rgb(var(--bg-subtle))]'), "aria-label": isListening ? t('Stop listening') : t('Voice input'), children: isListening ? _jsx(MicOff, { className: "w-4 h-4" }) : _jsx(Mic, { className: "w-4 h-4" }) })), isLoading && onStop ? (_jsx("button", { onClick: onStop, className: "shrink-0 !min-h-0 w-10 h-10 rounded-xl flex items-center justify-center transition-all duration-[180ms] ease-out shadow-sm bg-[rgb(var(--color-primary))] text-white hover:opacity-90 hover:scale-[1.04] active:scale-95 ring-1 ring-[rgb(var(--color-primary))]/20", "aria-label": "Stop generation", title: "Stop", children: _jsx("span", { className: "w-2.5 h-2.5 rounded-[2px] bg-white" }) })) : (_jsx("button", { onClick: handleSubmit, disabled: (!input.trim() && files.length === 0) || isListening || disabled, className: cn('shrink-0 !min-h-0 w-10 h-10 rounded-xl flex items-center justify-center transition-all duration-[180ms] ease-out shadow-md', (input.trim() || files.length > 0) && !isListening && !disabled
+                                ? 'bg-[rgb(var(--color-primary))] text-white hover:scale-[1.06] active:scale-95'
+                                : 'bg-[rgb(var(--bg-subtle))] text-[rgb(var(--fg-muted))] cursor-not-allowed shadow-none'), "aria-label": "Send message", children: _jsx(Send, { className: "w-4 h-4 transition-transform duration-200 active:rotate-45" }) }))] })] }) }));
+}

package/dist/components/dashboard/DrillDownModal.d.ts

@@ -0,0 +1,15 @@
+import type { ColumnDef } from '@tanstack/react-table';
+export interface DrillContext {
+    key: string;
+    label: string;
+}
+interface DrillDownModalProps<T> {
+    drill: DrillContext | null;
+    onClose: () => void;
+    columns: ColumnDef<T>[];
+    getRowId: (row: T) => string;
+    fetcher: (drill: DrillContext) => Promise<T[]>;
+    titlePrefix?: string;
+}
+export declare function DrillDownModal<T>({ drill, onClose, columns, getRowId, fetcher, titlePrefix }: DrillDownModalProps<T>): import("react").JSX.Element;
+export {};

package/dist/components/dashboard/DrillDownModal.js

@@ -0,0 +1,33 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState, useEffect, useCallback } from 'react';
+import { StandardModal } from '../index.js';
+import { DataGrid } from '../index.js';
+import { useLanguage } from '../../contexts/LanguageContext.js';
+export function DrillDownModal({ drill, onClose, columns, getRowId, fetcher, titlePrefix }) {
+    const { t } = useLanguage();
+    const [rows, setRows] = useState([]);
+    const [loading, setLoading] = useState(false);
+    const [error, setError] = useState(null);
+    const load = useCallback(async (ctx) => {
+        setLoading(true);
+        setError(null);
+        try {
+            setRows(await fetcher(ctx));
+        }
+        catch {
+            setError(t('Failed to load details'));
+            setRows([]);
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [fetcher, t]);
+    useEffect(() => {
+        if (drill)
+            load(drill);
+        else
+            setRows([]);
+    }, [drill, load]);
+    return (_jsx(StandardModal, { isOpen: !!drill, onClose: onClose, title: drill?.label || '', subtitle: titlePrefix, size: "xl", showFooter: false, children: loading ? (_jsx("div", { className: "h-64 flex items-center justify-center text-sm text-[rgb(var(--fg-muted))]", children: t('Loading...') })) : error ? (_jsx("div", { className: "h-64 flex items-center justify-center text-sm text-[rgb(var(--color-error))]", children: error })) : (_jsx(DataGrid, { data: rows, columns: columns, getRowId: getRowId, pageSize: 15, enablePagination: true, enableSorting: true, enableFilterRow: true, title: `${drill?.label || ''} (${rows.length})` })) }));
+}

package/dist/components/dashboard/FilterBar.d.ts

@@ -0,0 +1,108 @@
+import * as React from 'react';
+export interface FilterConfig {
+    id: string;
+    label: string;
+    type: 'dropdown' | 'multiselect';
+    options: Array<{
+        value: string;
+        label: string;
+    }>;
+    placeholder?: string;
+}
+export interface ReportOption {
+    value: string;
+    label: string;
+    dividerAfter?: boolean;
+}
+export interface ToggleOption {
+    value: string;
+    label: string;
+}
+export type ForecastMethod = 'ma' | 'wma' | 'es' | 'holt';
+export interface ForecastSelection {
+    enabled: boolean;
+    method: ForecastMethod;
+    period: number;
+    horizon: number;
+}
+export declare const FORECAST_METHODS: Array<{
+    value: ForecastMethod;
+    label: string;
+    hint: string;
+}>;
+export declare function computeForecast(values: number[], method: ForecastMethod, period: number): Array<number | null>;
+export declare function projectForecast(values: number[], method: ForecastMethod, period: number, horizon: number): number[];
+export interface TimeFilterSelection {
+    type: 'Day' | 'Week' | 'Month' | 'Quarter' | 'Year';
+    /** For Day type: selected days like ['today', 'yesterday', 'last7'] */
+    days?: string[];
+    /** For Week type: selected weeks like ['this', 'last', 'last2'] */
+    weeks?: string[];
+    /** For Month type: selected months like ['this', 'last', 'jan', 'feb'] */
+    months?: string[];
+    /** For Quarter type: selected quarters like ['Q1', 'Q2'] */
+    quarters?: string[];
+    /** For Year type: selected years */
+    years?: string[];
+}
+export interface FilterBarProps {
+    /** Dashboard title */
+    title: string;
+    /** Dynamic context label (shown as subtitle) */
+    contextLabel?: string;
+    /** Secondary toggle (e.g., Job/Value) */
+    secondaryToggle?: {
+        options: ToggleOption[];
+        value: string;
+        onChange: (value: string) => void;
+    };
+    /** Time filter */
+    timeFilter?: 'Day' | 'Week' | 'Month' | 'Quarter' | 'Year';
+    onTimeFilterChange?: (filter: 'Day' | 'Week' | 'Month' | 'Quarter' | 'Year') => void;
+    /** Time filter selection (for dropdown selections) */
+    timeFilterSelection?: TimeFilterSelection;
+    onTimeFilterSelectionChange?: (selection: TimeFilterSelection) => void;
+    /** Hide time filter toggle */
+    hideTimeFilter?: boolean;
+    /** Filter configurations */
+    filters?: FilterConfig[];
+    /** Filter values (controlled) */
+    filterValues?: Record<string, string | string[]>;
+    onFilterChange?: (filterId: string, value: string | string[]) => void;
+    /** Date range */
+    dateFrom?: Date;
+    dateTo?: Date;
+    onDateFromChange?: (date: Date | undefined) => void;
+    onDateToChange?: (date: Date | undefined) => void;
+    /** Apply/Reset handlers */
+    onApply?: () => void;
+    onReset?: () => void;
+    /** Reports dropdown */
+    reports?: ReportOption[];
+    onReportSelect?: (reportValue: string) => void;
+    /** Export dropdown (Print, Excel, PDF) - shows automatically when onExport is provided */
+    onExport?: (exportType: 'print' | 'excel' | 'pdf') => void;
+    /** Hide filter button */
+    hideFilterButton?: boolean;
+    /** Hide date range picker */
+    hideDateRange?: boolean;
+    /** Show Apply button */
+    showApplyButton?: boolean;
+    /** Forecast selector — shows automatically when provided */
+    forecast?: ForecastSelection;
+    onForecastChange?: (forecast: ForecastSelection) => void;
+    /** Share button — shows next to the forecast control when provided */
+    onShare?: () => void;
+    /** Insights button */
+    showInsights?: boolean;
+    insightsActive?: boolean;
+    onInsightsClick?: () => void;
+    /** Fiscal-year start year (e.g. 2026 for FY 2026-2027). Drives fiscal Week/Month/Quarter/Year options. */
+    fiscalStartYear?: number;
+    /** Additional content */
+    children?: React.ReactNode;
+    className?: string;
+    /** Layout variant: 'default' or 'centered' (title in center) */
+    layout?: 'default' | 'centered';
+}
+export declare function FilterBar({ title, contextLabel, secondaryToggle, timeFilter, onTimeFilterChange, timeFilterSelection, onTimeFilterSelectionChange, hideTimeFilter, filters, filterValues, onFilterChange, dateFrom, dateTo, onDateFromChange, onDateToChange, onApply, onReset, reports, onReportSelect, onExport, hideFilterButton, hideDateRange, showApplyButton, forecast, onForecastChange, onShare, showInsights, insightsActive, onInsightsClick, children, className, layout, fiscalStartYear }: FilterBarProps): React.JSX.Element;