indas-ui 0.0.1 → 0.1.1

package/dist/hooks/useDebounce.js

@@ -0,0 +1,45 @@
+'use client';
+import { useCallback, useEffect, useRef, useState } from 'react';
+/**
+ * Custom hook for debouncing function calls
+ * @param callback - The function to debounce
+ * @param delay - Delay in milliseconds
+ * @returns Debounced function
+ */
+export function useDebounce(callback, delay) {
+    const timeoutRef = useRef();
+    const debouncedCallback = useCallback((...args) => {
+        if (timeoutRef.current) {
+            clearTimeout(timeoutRef.current);
+        }
+        timeoutRef.current = setTimeout(() => {
+            callback(...args);
+        }, delay);
+    }, [callback, delay]);
+    useEffect(() => {
+        return () => {
+            if (timeoutRef.current) {
+                clearTimeout(timeoutRef.current);
+            }
+        };
+    }, []);
+    return debouncedCallback;
+}
+/**
+ * Custom hook for debouncing state values
+ * @param value - The value to debounce
+ * @param delay - Delay in milliseconds
+ * @returns Debounced value
+ */
+export function useDebouncedValue(value, delay) {
+    const [debouncedValue, setDebouncedValue] = useState(value);
+    useEffect(() => {
+        const handler = setTimeout(() => {
+            setDebouncedValue(value);
+        }, delay);
+        return () => {
+            clearTimeout(handler);
+        };
+    }, [value, delay]);
+    return debouncedValue;
+}

package/dist/hooks/useDraft.d.ts

@@ -0,0 +1,46 @@
+/**
+ * useDraft Hook - Milestone Based
+ *
+ * React hook for milestone-based draft management.
+ * User manually saves at important points (milestones) during estimation.
+ *
+ * Usage:
+ * ```typescript
+ * const {
+ *   saveDraft,
+ *   loadDraft,
+ *   deleteDraft,
+ *   listDrafts,
+ *   drafts,
+ *   lastSaved,
+ *   isSaving
+ * } = useDraft('ESTIMATION', currentEstimationState)
+ * ```
+ */
+import type { DraftMetadata } from '../types/draft.js';
+export interface UseDraftReturn {
+    /** Manually save a draft at a milestone */
+    saveDraft: (draftName: string, documentId?: string | null, documentName?: string | null, remark?: string) => Promise<boolean>;
+    /** Load a draft by ID */
+    loadDraft: (draftId: number) => Promise<any | null>;
+    /** Delete a draft */
+    deleteDraft: (draftId: number) => Promise<boolean>;
+    /** Rename a draft */
+    renameDraft: (draftId: number, newName: string) => Promise<boolean>;
+    /** List all drafts */
+    listDrafts: () => Promise<void>;
+    /** Array of available drafts */
+    drafts: DraftMetadata[];
+    /** Whether drafts are being loaded */
+    isLoadingDrafts: boolean;
+    /** Last saved timestamp */
+    lastSaved: Date | null;
+    /** Whether a save operation is in progress */
+    isSaving: boolean;
+    /** Current draft ID (if loaded from draft) */
+    currentDraftId: number | null;
+}
+/**
+ * useDraft Hook - Milestone Based
+ */
+export declare function useDraft(module: string, currentState: any): UseDraftReturn;

package/dist/hooks/useDraft.js

@@ -0,0 +1,178 @@
+'use client';
+/**
+ * useDraft Hook - Milestone Based
+ *
+ * React hook for milestone-based draft management.
+ * User manually saves at important points (milestones) during estimation.
+ *
+ * Usage:
+ * ```typescript
+ * const {
+ *   saveDraft,
+ *   loadDraft,
+ *   deleteDraft,
+ *   listDrafts,
+ *   drafts,
+ *   lastSaved,
+ *   isSaving
+ * } = useDraft('ESTIMATION', currentEstimationState)
+ * ```
+ */
+import { useState, useEffect, useCallback } from 'react';
+import { useSession } from 'next-auth/react';
+import { DraftAPI } from '../lib/api/draft/index.js';
+/**
+ * useDraft Hook - Milestone Based
+ */
+export function useDraft(module, currentState) {
+    const { data: session } = useSession();
+    // State
+    const [drafts, setDrafts] = useState([]);
+    const [isLoadingDrafts, setIsLoadingDrafts] = useState(false);
+    const [lastSaved, setLastSaved] = useState(null);
+    const [isSaving, setIsSaving] = useState(false);
+    const [currentDraftId, setCurrentDraftId] = useState(null);
+    const [currentDraftDocumentId, setCurrentDraftDocumentId] = useState(null);
+    /**
+     * Save a draft (milestone-based)
+     */
+    const saveDraft = useCallback(async (draftName, documentId, documentName, remark) => {
+        if (!session)
+            return false;
+        setIsSaving(true);
+        try {
+            // Smart draft ID logic:
+            // Only use currentDraftId if the document ID matches (same quote)
+            // If document ID changed, create a NEW draft instead of updating old one
+            const shouldUpdateExistingDraft = currentDraftId &&
+                currentDraftDocumentId === documentId;
+            const draftIdToUse = shouldUpdateExistingDraft ? currentDraftId : null;
+            const response = await DraftAPI.saveDraft(draftName, currentState, module, documentId || null, documentName || null, draftIdToUse, // Only update if same document
+            session, remark);
+            if (response.success && response.data) {
+                setLastSaved(new Date());
+                setCurrentDraftId(response.data.draftId);
+                setCurrentDraftDocumentId(documentId || null); // Track which quote this draft belongs to
+                return true;
+            }
+            else {
+                console.error('❌ [DRAFT] Save failed - API response:', response.error || 'No error message');
+                return false;
+            }
+        }
+        catch (error) {
+            console.error('❌ [DRAFT] Save exception:', error);
+            return false;
+        }
+        finally {
+            setIsSaving(false);
+        }
+    }, [session, currentState, module, currentDraftId, currentDraftDocumentId]);
+    /**
+     * Load a draft
+     */
+    const loadDraft = useCallback(async (draftId) => {
+        if (!session)
+            return null;
+        try {
+            const response = await DraftAPI.loadDraft(draftId, session);
+            if (response.success && response.data) {
+                setCurrentDraftId(draftId);
+                setLastSaved(new Date(response.data.lastSaved));
+                // Extract documentId from draftData to track which quote this draft belongs to
+                const documentId = response.data.draftData?.quoteNumber || null;
+                setCurrentDraftDocumentId(documentId);
+                return response.data.draftData;
+            }
+            else {
+                return null;
+            }
+        }
+        catch (error) {
+            return null;
+        }
+    }, [session]);
+    /**
+     * Delete a draft
+     */
+    const deleteDraft = useCallback(async (draftId) => {
+        if (!session)
+            return false;
+        try {
+            const response = await DraftAPI.deleteDraft(draftId, session);
+            if (response.success) {
+                await listDrafts();
+                return true;
+            }
+            else {
+                return false;
+            }
+        }
+        catch (error) {
+            return false;
+        }
+    }, [session]);
+    /**
+     * Rename a draft
+     */
+    const renameDraft = useCallback(async (draftId, newName) => {
+        if (!session)
+            return false;
+        try {
+            const response = await DraftAPI.renameDraft(draftId, newName, session);
+            if (response.success) {
+                await listDrafts();
+                return true;
+            }
+            else {
+                return false;
+            }
+        }
+        catch (error) {
+            return false;
+        }
+    }, [session]);
+    /**
+     * List all drafts for current module
+     */
+    const listDrafts = useCallback(async () => {
+        if (!session)
+            return;
+        setIsLoadingDrafts(true);
+        try {
+            const response = await DraftAPI.listDrafts(module, session);
+            if (response.success && response.data) {
+                setDrafts(response.data);
+            }
+            else {
+                setDrafts([]);
+            }
+        }
+        catch (error) {
+            setDrafts([]);
+        }
+        finally {
+            setIsLoadingDrafts(false);
+        }
+    }, [session, module]);
+    /**
+     * Load drafts on mount
+     */
+    useEffect(() => {
+        if (session) {
+            listDrafts();
+        }
+    }, [session, listDrafts]);
+    return {
+        saveDraft,
+        loadDraft,
+        deleteDraft,
+        renameDraft,
+        listDrafts,
+        drafts,
+        isLoadingDrafts,
+        lastSaved,
+        isSaving,
+        currentDraftId
+    };
+}

package/dist/hooks/useFormValidation.d.ts

@@ -0,0 +1,37 @@
+interface FieldRule {
+    /** Field is required (non-empty, non-null, non-undefined) */
+    required?: boolean;
+    /** Custom validation — return error message string, or true if valid */
+    validate?: (value: any, formData: Record<string, any>) => true | string;
+}
+type ValidationRules = Record<string, FieldRule>;
+interface UseFormValidationReturn {
+    /**
+     * Run full validation. Flips showErrors to true so fields highlight.
+     * Returns { isValid, errorMessages }.
+     */
+    validate: (formData: Record<string, any>) => {
+        isValid: boolean;
+        errorMessages: string[];
+    };
+    /**
+     * Check if a single field is invalid RIGHT NOW (reactive to current value).
+     * Use on Input: `error={fieldError('length', planningData.length)}`
+     * Use on Dropdown: `error={fieldError('gsm', planningData.gsm)}`
+     * Returns false until showErrors is true (first save attempt).
+     */
+    fieldError: (fieldName: string, currentValue: any) => boolean;
+    /**
+     * Returns label className — adds red text when field is invalid.
+     * Use: `className={fieldLabelClass('length', planningData.length, 'text-xs font-medium')}`
+     */
+    fieldLabelClass: (fieldName: string, currentValue: any, baseClass?: string) => string;
+    /** Whether validation has fired at least once (save attempted) */
+    showErrors: boolean;
+    /** Manually set showErrors (e.g., parent page sets it on save) */
+    setShowErrors: (show: boolean) => void;
+    /** Reset — call on modal close or form reset */
+    clearErrors: () => void;
+}
+export declare function useFormValidation(rules: ValidationRules): UseFormValidationReturn;
+export {};

package/dist/hooks/useFormValidation.js

@@ -0,0 +1,65 @@
+'use client';
+import { useState, useCallback, useRef } from 'react';
+// ─── Helpers ─────────────────────────────────────────────────────
+function isValueEmpty(value) {
+    if (value === undefined || value === null)
+        return true;
+    if (typeof value === 'string' && value.trim() === '')
+        return true;
+    if (Array.isArray(value) && value.length === 0)
+        return true;
+    return false;
+}
+function checkField(fieldName, currentValue, rules, formData) {
+    const rule = rules[fieldName];
+    if (!rule)
+        return false;
+    if (rule.required && isValueEmpty(currentValue))
+        return true;
+    if (rule.validate) {
+        const result = rule.validate(currentValue, formData || {});
+        if (result !== true)
+            return true;
+    }
+    return false;
+}
+// ─── Hook ────────────────────────────────────────────────────────
+export function useFormValidation(rules) {
+    const [showErrors, setShowErrors] = useState(false);
+    const rulesRef = useRef(rules);
+    rulesRef.current = rules;
+    const validate = useCallback((formData) => {
+        const errorMessages = [];
+        const currentRules = rulesRef.current;
+        for (const [fieldName, rule] of Object.entries(currentRules)) {
+            const value = formData[fieldName];
+            if (rule.required && isValueEmpty(value)) {
+                errorMessages.push(fieldName);
+                continue;
+            }
+            if (rule.validate) {
+                const result = rule.validate(value, formData);
+                if (result !== true) {
+                    errorMessages.push(result);
+                }
+            }
+        }
+        setShowErrors(true);
+        return { isValid: errorMessages.length === 0, errorMessages };
+    }, []);
+    const fieldError = useCallback((fieldName, currentValue) => {
+        if (!showErrors)
+            return false;
+        return checkField(fieldName, currentValue, rulesRef.current);
+    }, [showErrors]);
+    const fieldLabelClass = useCallback((fieldName, currentValue, baseClass = 'text-xs font-medium') => {
+        if (!showErrors)
+            return baseClass;
+        const invalid = checkField(fieldName, currentValue, rulesRef.current);
+        return invalid ? `${baseClass} text-[rgb(var(--color-error))]` : baseClass;
+    }, [showErrors]);
+    const clearErrors = useCallback(() => {
+        setShowErrors(false);
+    }, []);
+    return { validate, fieldError, fieldLabelClass, showErrors, setShowErrors, clearErrors };
+}

package/dist/hooks/useGridSettings.d.ts

@@ -0,0 +1,26 @@
+interface GridSettings {
+    columnVisibility: Record<string, boolean>;
+    columnOrder: string[];
+    frozenColumns: string[];
+    pageSize: number;
+    searchType: 'advanced' | 'new';
+    sortingState: any[];
+    filterState: any[];
+}
+/**
+ * Hook for persistent grid settings using localStorage
+ * @param gridId - Unique identifier for the grid instance
+ */
+export declare function useGridSettings(gridId: string): {
+    settings: GridSettings;
+    updateColumnVisibility: (visibility: Record<string, boolean>) => void;
+    updateColumnOrder: (order: string[]) => void;
+    updateFrozenColumns: (frozen: string[]) => void;
+    updatePageSize: (size: number) => void;
+    updateSearchType: (type: "advanced" | "new") => void;
+    updateSortingState: (sorting: any[]) => void;
+    updateFilterState: (filters: any[]) => void;
+    clearSettings: () => void;
+    saveSettings: (newSettings: Partial<GridSettings>) => void;
+};
+export {};

package/dist/hooks/useGridSettings.js

@@ -0,0 +1,82 @@
+'use client';
+import { useState, useCallback } from 'react';
+const DEFAULT_SETTINGS = {
+    columnVisibility: {},
+    columnOrder: [],
+    frozenColumns: [],
+    pageSize: 50,
+    searchType: 'advanced',
+    sortingState: [],
+    filterState: []
+};
+/**
+ * Hook for persistent grid settings using localStorage
+ * @param gridId - Unique identifier for the grid instance
+ */
+export function useGridSettings(gridId) {
+    const storageKey = `grid-settings-${gridId}`;
+    const [settings, setSettings] = useState(() => {
+        if (typeof window === 'undefined')
+            return DEFAULT_SETTINGS;
+        try {
+            const stored = localStorage.getItem(storageKey);
+            return stored ? { ...DEFAULT_SETTINGS, ...JSON.parse(stored) } : DEFAULT_SETTINGS;
+        }
+        catch (error) {
+            return DEFAULT_SETTINGS;
+        }
+    });
+    // Save settings to localStorage
+    const saveSettings = useCallback((newSettings) => {
+        const updatedSettings = { ...settings, ...newSettings };
+        setSettings(updatedSettings);
+        try {
+            localStorage.setItem(storageKey, JSON.stringify(updatedSettings));
+        }
+        catch (error) {
+        }
+    }, [settings, storageKey]);
+    // Individual setting updaters
+    const updateColumnVisibility = useCallback((visibility) => {
+        saveSettings({ columnVisibility: visibility });
+    }, [saveSettings]);
+    const updateColumnOrder = useCallback((order) => {
+        saveSettings({ columnOrder: order });
+    }, [saveSettings]);
+    const updateFrozenColumns = useCallback((frozen) => {
+        saveSettings({ frozenColumns: frozen });
+    }, [saveSettings]);
+    const updatePageSize = useCallback((size) => {
+        saveSettings({ pageSize: size });
+    }, [saveSettings]);
+    const updateSearchType = useCallback((type) => {
+        saveSettings({ searchType: type });
+    }, [saveSettings]);
+    const updateSortingState = useCallback((sorting) => {
+        saveSettings({ sortingState: sorting });
+    }, [saveSettings]);
+    const updateFilterState = useCallback((filters) => {
+        saveSettings({ filterState: filters });
+    }, [saveSettings]);
+    // Clear all settings
+    const clearSettings = useCallback(() => {
+        setSettings(DEFAULT_SETTINGS);
+        try {
+            localStorage.removeItem(storageKey);
+        }
+        catch (error) {
+        }
+    }, [storageKey]);
+    return {
+        settings,
+        updateColumnVisibility,
+        updateColumnOrder,
+        updateFrozenColumns,
+        updatePageSize,
+        updateSearchType,
+        updateSortingState,
+        updateFilterState,
+        clearSettings,
+        saveSettings
+    };
+}

package/dist/hooks/useGridTheme.d.ts

@@ -0,0 +1,59 @@
+export type GridTheme = 'light' | 'dark' | 'high-contrast' | 'auto';
+interface ThemeConfig {
+    theme: GridTheme;
+    customColors?: Record<string, string>;
+    autoDetectSystemTheme?: boolean;
+}
+/**
+ * Hook for managing grid theme with system preference detection
+ * and persistent storage
+ */
+export declare function useGridTheme(initialConfig?: Partial<ThemeConfig>): {
+    setTheme: (newTheme: GridTheme) => void;
+    toggleTheme: () => void;
+    resetToSystemTheme: () => void;
+    getThemeProperties: () => Record<string, string>;
+    setCustomColors: (colors: Record<string, string>) => void;
+    clearCustomColors: () => void;
+    current: GridTheme;
+    resolved: "dark" | "light" | "high-contrast";
+    isAuto: boolean;
+    isDark: boolean;
+    isLight: boolean;
+    isHighContrast: boolean;
+    systemTheme: "dark" | "light";
+    systemSupportsDarkMode: boolean;
+};
+export declare function getThemeClasses(theme?: GridTheme): string;
+export declare const THEME_PRESETS: {
+    readonly default: {
+        readonly theme: GridTheme;
+        readonly autoDetectSystemTheme: true;
+    };
+    readonly corporate: {
+        readonly theme: GridTheme;
+        readonly customColors: {
+            readonly 'accent-primary': "#1e40af";
+            readonly 'accent-secondary': "#1e3a8a";
+            readonly 'header-bg': "#f8fafc";
+            readonly 'border-primary': "#e2e8f0";
+        };
+    };
+    readonly minimal: {
+        readonly theme: GridTheme;
+        readonly customColors: {
+            readonly 'border-primary': "#f1f5f9";
+            readonly 'header-bg': "#ffffff";
+            readonly 'bg-hover': "#fafafa";
+        };
+    };
+    readonly vibrant: {
+        readonly theme: GridTheme;
+        readonly customColors: {
+            readonly 'accent-primary': "#8b5cf6";
+            readonly 'accent-secondary': "#a78bfa";
+            readonly 'bg-selected': "#5b21b6";
+        };
+    };
+};
+export {};