indas-ui 0.0.1 → 0.1.0

package/dist/cjs/lib/theme/utils.js

@@ -0,0 +1,363 @@
+'use client';
+"use strict";
+// Theme utility functions
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.hexToRgb = hexToRgb;
+exports.rgbToHex = rgbToHex;
+exports.rgbToHsl = rgbToHsl;
+exports.hslToRgb = hslToRgb;
+exports.getLuminance = getLuminance;
+exports.getContrastRatio = getContrastRatio;
+exports.meetsContrastRequirement = meetsContrastRequirement;
+exports.darkenColor = darkenColor;
+exports.lightenColor = lightenColor;
+exports.generateColorVariants = generateColorVariants;
+exports.validateTheme = validateTheme;
+exports.getSystemTheme = getSystemTheme;
+exports.generateCustomPropertiesString = generateCustomPropertiesString;
+exports.applyCustomTheme = applyCustomTheme;
+exports.removeCustomTheme = removeCustomTheme;
+exports.getThemeClassName = getThemeClassName;
+exports.getThemeColors = getThemeColors;
+exports.prefersReducedMotion = prefersReducedMotion;
+const types_1 = require("./types.js");
+/**
+ * Convert hex color to RGB
+ */
+function hexToRgb(hex) {
+    const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+    return result ? {
+        r: parseInt(result[1], 16),
+        g: parseInt(result[2], 16),
+        b: parseInt(result[3], 16)
+    } : null;
+}
+/**
+ * Convert RGB to hex
+ */
+function rgbToHex(r, g, b) {
+    return "#" + [r, g, b].map(x => {
+        const hex = Math.round(x).toString(16);
+        return hex.length === 1 ? "0" + hex : hex;
+    }).join("");
+}
+/**
+ * Convert RGB to HSL
+ */
+function rgbToHsl(r, g, b) {
+    r /= 255;
+    g /= 255;
+    b /= 255;
+    const max = Math.max(r, g, b);
+    const min = Math.min(r, g, b);
+    let h, s, l;
+    l = (max + min) / 2;
+    if (max === min) {
+        h = s = 0; // achromatic
+    }
+    else {
+        const d = max - min;
+        s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
+        switch (max) {
+            case r:
+                h = (g - b) / d + (g < b ? 6 : 0);
+                break;
+            case g:
+                h = (b - r) / d + 2;
+                break;
+            case b:
+                h = (r - g) / d + 4;
+                break;
+            default: h = 0;
+        }
+        h /= 6;
+    }
+    return { h: h * 360, s: s * 100, l: l * 100 };
+}
+/**
+ * Convert HSL to RGB
+ */
+function hslToRgb(h, s, l) {
+    h /= 360;
+    s /= 100;
+    l /= 100;
+    const hue2rgb = (p, q, t) => {
+        if (t < 0)
+            t += 1;
+        if (t > 1)
+            t -= 1;
+        if (t < 1 / 6)
+            return p + (q - p) * 6 * t;
+        if (t < 1 / 2)
+            return q;
+        if (t < 2 / 3)
+            return p + (q - p) * (2 / 3 - t) * 6;
+        return p;
+    };
+    let r, g, b;
+    if (s === 0) {
+        r = g = b = l; // achromatic
+    }
+    else {
+        const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
+        const p = 2 * l - q;
+        r = hue2rgb(p, q, h + 1 / 3);
+        g = hue2rgb(p, q, h);
+        b = hue2rgb(p, q, h - 1 / 3);
+    }
+    return { r: Math.round(r * 255), g: Math.round(g * 255), b: Math.round(b * 255) };
+}
+/**
+ * Calculate relative luminance of a color (WCAG formula)
+ */
+function getLuminance(rgb) {
+    const { r, g, b } = rgb;
+    const [rs, gs, bs] = [r, g, b].map(c => {
+        c = c / 255;
+        return c <= 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
+    });
+    return 0.2126 * rs + 0.7152 * gs + 0.0722 * bs;
+}
+/**
+ * Calculate contrast ratio between two colors (WCAG formula)
+ */
+function getContrastRatio(rgb1, rgb2) {
+    const lum1 = getLuminance(rgb1);
+    const lum2 = getLuminance(rgb2);
+    const brightest = Math.max(lum1, lum2);
+    const darkest = Math.min(lum1, lum2);
+    return (brightest + 0.05) / (darkest + 0.05);
+}
+/**
+ * Check if a color combination meets WCAG AA standards
+ */
+function meetsContrastRequirement(foreground, background, level = 'AA', isLargeText = false) {
+    const ratio = getContrastRatio(foreground, background);
+    const requirement = level === 'AA'
+        ? (isLargeText ? types_1.CONTRAST_RATIOS.AA_LARGE : types_1.CONTRAST_RATIOS.AA_NORMAL)
+        : (isLargeText ? types_1.CONTRAST_RATIOS.AAA_LARGE : types_1.CONTRAST_RATIOS.AAA_NORMAL);
+    return ratio >= requirement;
+}
+/**
+ * Generate a darker shade of a color
+ */
+function darkenColor(hex, amount) {
+    const rgb = hexToRgb(hex);
+    if (!rgb)
+        return hex;
+    const hsl = rgbToHsl(rgb.r, rgb.g, rgb.b);
+    hsl.l = Math.max(0, hsl.l - amount);
+    const darkened = hslToRgb(hsl.h, hsl.s, hsl.l);
+    return rgbToHex(darkened.r, darkened.g, darkened.b);
+}
+/**
+ * Generate a lighter shade of a color
+ */
+function lightenColor(hex, amount) {
+    const rgb = hexToRgb(hex);
+    if (!rgb)
+        return hex;
+    const hsl = rgbToHsl(rgb.r, rgb.g, rgb.b);
+    hsl.l = Math.min(100, hsl.l + amount);
+    const lightened = hslToRgb(hsl.h, hsl.s, hsl.l);
+    return rgbToHex(lightened.r, lightened.g, lightened.b);
+}
+/**
+ * Generate color variants from a base accent color
+ */
+function generateColorVariants(baseHex) {
+    // Ensure we have a valid hex color
+    const rgb = hexToRgb(baseHex);
+    if (!rgb) {
+        throw new Error(`Invalid hex color: ${baseHex}`);
+    }
+    return {
+        accent: baseHex,
+        accentHover: darkenColor(baseHex, 10),
+        accentSubtle: lightenColor(baseHex, 45),
+        accentMuted: lightenColor(baseHex, 25),
+    };
+}
+/**
+ * Validate a custom theme for accessibility compliance
+ */
+function validateTheme(colors, mode = 'light') {
+    const errors = [];
+    const warnings = [];
+    // Define background colors for contrast testing
+    const backgrounds = {
+        light: { r: 255, g: 255, b: 255 }, // white
+        dark: { r: 15, g: 23, b: 42 }, // slate-900
+    };
+    const textColors = {
+        light: { r: 17, g: 24, b: 39 }, // gray-900
+        dark: { r: 248, g: 250, b: 252 }, // slate-50
+    };
+    const background = backgrounds[mode];
+    const textColor = textColors[mode];
+    // Validate accent color
+    const accentRgb = hexToRgb(colors.accent);
+    if (!accentRgb) {
+        errors.push('Invalid accent color format');
+        return { isValid: false, errors, warnings };
+    }
+    // Check contrast ratios
+    const accentBgContrast = getContrastRatio(accentRgb, background);
+    const accentTextContrast = getContrastRatio(textColor, accentRgb);
+    let contrastRatio = Math.min(accentBgContrast, accentTextContrast);
+    if (!meetsContrastRequirement(textColor, accentRgb, 'AA', false)) {
+        errors.push(`Accent color fails WCAG AA contrast requirement (${contrastRatio.toFixed(2)}:1, minimum 4.5:1)`);
+    }
+    if (!meetsContrastRequirement(textColor, accentRgb, 'AAA', false)) {
+        warnings.push(`Accent color fails WCAG AAA contrast requirement (${contrastRatio.toFixed(2)}:1, minimum 7:1)`);
+    }
+    // Validate other color variants
+    const variants = ['accentHover', 'accentSubtle', 'accentMuted'];
+    for (const variant of variants) {
+        const rgb = hexToRgb(colors[variant]);
+        if (!rgb) {
+            errors.push(`Invalid ${variant} color format`);
+        }
+    }
+    return {
+        isValid: errors.length === 0,
+        errors,
+        warnings,
+        contrastRatio
+    };
+}
+/**
+ * Get system color scheme preference
+ */
+function getSystemTheme() {
+    if (typeof window === 'undefined')
+        return 'light';
+    return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+}
+/**
+ * Generate CSS custom properties string for a theme
+ */
+function generateCustomPropertiesString(colors, mode) {
+    const rgb = (hex) => {
+        const color = hexToRgb(hex);
+        return color ? `${color.r} ${color.g} ${color.b}` : '59 130 246'; // fallback to blue
+    };
+    const prefix = mode === 'dark' ? '--custom-accent-dark' : '--custom-accent';
+    return `
+    ${prefix}: ${rgb(colors.accent)};
+    ${prefix}-hover: ${rgb(colors.accentHover)};
+    ${prefix}-subtle: ${rgb(colors.accentSubtle)};
+    ${prefix}-muted: ${rgb(colors.accentMuted)};
+  `.trim();
+}
+/**
+ * Generate harmonious secondary color by rotating hue
+ */
+function generateSecondaryColor(hex) {
+    const rgbColor = hexToRgb(hex);
+    if (!rgbColor)
+        return hex;
+    const hsl = rgbToHsl(rgbColor.r, rgbColor.g, rgbColor.b);
+    // Rotate hue by 30 degrees for analogous harmony
+    hsl.h = (hsl.h + 30) % 360;
+    // Slightly adjust saturation
+    hsl.s = Math.max(20, hsl.s - 10);
+    const newRgb = hslToRgb(hsl.h, hsl.s, hsl.l);
+    return rgbToHex(newRgb.r, newRgb.g, newRgb.b);
+}
+/**
+ * Generate harmonious tertiary color by rotating hue opposite direction
+ */
+function generateTertiaryColor(hex) {
+    const rgbColor = hexToRgb(hex);
+    if (!rgbColor)
+        return hex;
+    const hsl = rgbToHsl(rgbColor.r, rgbColor.g, rgbColor.b);
+    // Rotate hue by -30 degrees for analogous harmony
+    hsl.h = (hsl.h - 30 + 360) % 360;
+    // Slightly adjust saturation and lightness
+    hsl.s = Math.max(20, hsl.s - 10);
+    hsl.l = Math.min(90, hsl.l + 5);
+    const newRgb = hslToRgb(hsl.h, hsl.s, hsl.l);
+    return rgbToHex(newRgb.r, newRgb.g, newRgb.b);
+}
+/**
+ * Apply custom theme CSS variables to document
+ */
+function applyCustomTheme(colors) {
+    if (typeof document === 'undefined')
+        return;
+    const rgb = (hex) => {
+        const color = hexToRgb(hex);
+        return color ? `${color.r} ${color.g} ${color.b}` : '59 130 246';
+    };
+    // Generate secondary and tertiary colors using color theory
+    const primary = colors.accent;
+    const primaryHover = colors.accentHover;
+    const secondary = generateSecondaryColor(primary);
+    const secondaryHover = darkenColor(secondary, 10);
+    const tertiary = generateTertiaryColor(primary);
+    const tertiaryHover = darkenColor(tertiary, 10);
+    let styleEl = document.getElementById('custom-theme-vars');
+    if (!styleEl) {
+        styleEl = document.createElement('style');
+        styleEl.id = 'custom-theme-vars';
+        document.head.appendChild(styleEl);
+    }
+    // Apply to both light and dark modes
+    styleEl.textContent = `
+    :root.theme-custom.light,
+    :root.theme-custom.dark {
+      --color-primary: ${rgb(primary)};
+      --color-primary-hover: ${rgb(primaryHover)};
+      --color-primary-subtle: ${rgb(colors.accentSubtle)};
+      --color-primary-muted: ${rgb(colors.accentMuted)};
+
+      --color-secondary: ${rgb(secondary)};
+      --color-secondary-hover: ${rgb(secondaryHover)};
+      --color-secondary-subtle: ${rgb(lightenColor(secondary, 40))};
+      --color-secondary-muted: ${rgb(lightenColor(secondary, 20))};
+
+      --color-tertiary: ${rgb(tertiary)};
+      --color-tertiary-hover: ${rgb(tertiaryHover)};
+      --color-tertiary-subtle: ${rgb(lightenColor(tertiary, 40))};
+      --color-tertiary-muted: ${rgb(lightenColor(tertiary, 20))};
+
+      --color-accent: ${rgb(primary)};
+      --bd-accent: ${rgb(primary)};
+    }
+  `;
+}
+/**
+ * Remove custom theme CSS variables
+ */
+function removeCustomTheme() {
+    if (typeof document === 'undefined')
+        return;
+    const styleEl = document.getElementById('custom-theme-vars');
+    if (styleEl) {
+        styleEl.remove();
+    }
+}
+/**
+ * Generate theme class name
+ */
+function getThemeClassName(theme) {
+    return `theme-${theme.variant} ${theme.mode}`;
+}
+/**
+ * Get predefined theme colors
+ */
+function getThemeColors(variant, mode) {
+    if (variant === 'custom')
+        return null;
+    return types_1.THEME_COLORS[variant][mode];
+}
+/**
+ * Check if device prefers reduced motion
+ */
+function prefersReducedMotion() {
+    if (typeof window === 'undefined')
+        return false;
+    return window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+}

package/dist/cjs/lib/types/index.js

@@ -0,0 +1,3 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/lib/utils/attachment-loader.js

@@ -0,0 +1,82 @@
+'use client';
+"use strict";
+/**
+ * Attachment Loader Utility
+ *
+ * Loads file attachments from API response and converts them to blob URLs
+ * Used by: quotation-loader.ts, estimation page (load enquiry), enquiry modal
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.loadFileAttachments = loadFileAttachments;
+const storage_1 = require("../api/activity/storage.js");
+/**
+ * Map file extensions to MIME types
+ */
+const getMimeType = (ext) => {
+    const mimeTypes = {
+        'pdf': 'application/pdf',
+        'jpg': 'image/jpeg',
+        'jpeg': 'image/jpeg',
+        'png': 'image/png',
+        'gif': 'image/gif',
+        'bmp': 'image/bmp',
+        'webp': 'image/webp',
+        'xlsx': 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
+        'xls': 'application/vnd.ms-excel',
+        'doc': 'application/msword',
+        'docx': 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+        'eml': 'message/rfc822',
+        'msg': 'application/vnd.ms-outlook'
+    };
+    return mimeTypes[ext.toLowerCase()] || 'application/octet-stream';
+};
+/**
+ * Load file attachments from API response
+ * Fetches files through proxy to get blob URLs and proper file sizes
+ *
+ * @param fileAttachments - Array of file attachment objects from API
+ * @returns Promise<AttachedFile[]> - Array of attached files with blob URLs
+ */
+async function loadFileAttachments(fileAttachments) {
+    if (!fileAttachments || !Array.isArray(fileAttachments) || fileAttachments.length === 0) {
+        return [];
+    }
+    const attachmentPromises = fileAttachments.map(async (file, index) => {
+        // Display name: the clean original filename (FileName column).
+        const rawName = file.AttachedFileName || '';
+        const displayName = rawName.includes('/') ? rawName.split('/').pop() || rawName : rawName;
+        // Fetch source: build the public S3 URL from the stored object key.
+        const fileUrl = (0, storage_1.storageFileUrl)(file.AttachedFileUrl || file.FilePath || '');
+        const ext = displayName.split('.').pop() || '';
+        const mimeType = getMimeType(ext);
+        try {
+            // Fetch the file through proxy to bypass CORS
+            const proxyUrl = `/api/proxy-file?url=${encodeURIComponent(fileUrl)}`;
+            const response = await fetch(proxyUrl);
+            if (!response.ok)
+                throw new Error('Fetch failed');
+            const blob = await response.blob();
+            const blobUrl = URL.createObjectURL(blob);
+            return {
+                id: file.AttachementID?.toString() || file.AttachmentID?.toString() || `attachment-${index}`,
+                name: displayName,
+                size: blob.size,
+                type: blob.type || mimeType,
+                url: blobUrl,
+                file: new File([blob], displayName, { type: blob.type || mimeType })
+            };
+        }
+        catch {
+            // If fetch fails, return with server URL (will open in new tab on preview)
+            return {
+                id: file.AttachementID?.toString() || file.AttachmentID?.toString() || `attachment-${index}`,
+                name: displayName,
+                size: 0,
+                type: mimeType,
+                url: fileUrl
+            };
+        }
+    });
+    const loadedAttachments = await Promise.all(attachmentPromises);
+    return loadedAttachments.filter(att => att.name);
+}

package/dist/cjs/lib/utils/client-lead-utils.js

@@ -0,0 +1,61 @@
+'use client';
+"use strict";
+// Utility functions for dynamic Lead/Client name display
+// Used across Enquiry and Estimation modules
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getClientLabelAndPlaceholder = getClientLabelAndPlaceholder;
+exports.isClientLead = isClientLead;
+exports.getClientDisplayName = getClientDisplayName;
+/**
+ * Get dynamic label and placeholder based on client's isLead status
+ * @param clientId - Selected client ID (as string)
+ * @param clients - Array of all clients
+ * @returns Object with label and placeholder strings
+ */
+function getClientLabelAndPlaceholder(clientId, clients) {
+    // No selection or no clients
+    if (!clientId || clientId === '__no_clients__' || clients.length === 0) {
+        return {
+            label: 'Lead / Customer Name',
+            placeholder: 'Select Lead / Customer Name'
+        };
+    }
+    // Find selected client
+    const selectedClient = clients.find(c => (c.LedgerId || c.ClientID)?.toString() === clientId);
+    if (!selectedClient) {
+        return {
+            label: 'Lead / Customer Name',
+            placeholder: 'Select Lead / Customer Name'
+        };
+    }
+    // Check IsLead: true = Lead, false = Client
+    const isLead = selectedClient.IsLead === true;
+    return {
+        label: isLead ? 'Lead Name' : 'Customer Name',
+        placeholder: isLead ? 'Select Lead Name' : 'Select Customer Name'
+    };
+}
+/**
+ * Check if a client is a lead
+ * @param client - Client object
+ * @returns true if client is a lead, false otherwise
+ */
+function isClientLead(client) {
+    if (!client)
+        return false;
+    return client.IsLead === true;
+}
+/**
+ * Get display name for a client (with Lead/Client prefix if needed)
+ * @param client - Client object
+ * @param includePrefix - Whether to include "Lead:" or "Client:" prefix
+ * @returns Display name string
+ */
+function getClientDisplayName(client, includePrefix = false) {
+    const name = client.LedgerName || client.ClientName;
+    if (!includePrefix) {
+        return name;
+    }
+    const prefix = isClientLead(client) ? 'Lead:' : 'Client:';
+    return `${prefix} ${name}`;
+}

package/dist/cjs/lib/utils/device-detection.js

@@ -0,0 +1,110 @@
+'use client';
+"use strict";
+/**
+ * Device Detection Utility
+ * Detects browser, OS, and device type from user agent
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.detectDevice = detectDevice;
+exports.getDeviceId = getDeviceId;
+exports.getDeviceName = getDeviceName;
+function detectDevice() {
+    if (typeof window === 'undefined') {
+        return {
+            browser: 'Unknown',
+            os: 'Unknown',
+            deviceType: 'desktop'
+        };
+    }
+    const userAgent = window.navigator.userAgent;
+    const platform = window.navigator.platform;
+    // Detect Browser
+    let browser = 'Unknown';
+    if (userAgent.includes('Chrome') && !userAgent.includes('Edg')) {
+        browser = 'Chrome';
+    }
+    else if (userAgent.includes('Edg')) {
+        browser = 'Edge';
+    }
+    else if (userAgent.includes('Safari') && !userAgent.includes('Chrome')) {
+        browser = 'Safari';
+    }
+    else if (userAgent.includes('Firefox')) {
+        browser = 'Firefox';
+    }
+    else if (userAgent.includes('MSIE') || userAgent.includes('Trident')) {
+        browser = 'Internet Explorer';
+    }
+    else if (userAgent.includes('Opera') || userAgent.includes('OPR')) {
+        browser = 'Opera';
+    }
+    // Detect OS
+    let os = 'Unknown';
+    if (platform.includes('Win')) {
+        os = 'Windows';
+    }
+    else if (platform.includes('Mac')) {
+        os = 'macOS';
+    }
+    else if (platform.includes('Linux')) {
+        os = 'Linux';
+    }
+    else if (userAgent.includes('Android')) {
+        os = 'Android';
+    }
+    else if (userAgent.includes('iOS') || userAgent.includes('iPhone') || userAgent.includes('iPad')) {
+        os = 'iOS';
+    }
+    // Detect Device Type
+    let deviceType = 'desktop';
+    if (/Mobi|Android/i.test(userAgent)) {
+        deviceType = 'mobile';
+    }
+    else if (/Tablet|iPad/i.test(userAgent)) {
+        deviceType = 'tablet';
+    }
+    return {
+        browser,
+        os,
+        deviceType
+    };
+}
+/**
+ * Get device ID from browser fingerprint
+ * Uses a combination of user agent, screen resolution, and timezone
+ */
+function getDeviceId() {
+    if (typeof window === 'undefined') {
+        return 'server';
+    }
+    const components = [
+        window.navigator.userAgent,
+        window.screen.width,
+        window.screen.height,
+        window.screen.colorDepth,
+        new Date().getTimezoneOffset(),
+        window.navigator.language
+    ];
+    // Simple hash function
+    const hash = components.join('|').split('').reduce((acc, char) => {
+        const chr = char.charCodeAt(0);
+        acc = ((acc << 5) - acc) + chr;
+        return acc & acc;
+    }, 0);
+    return `device-${Math.abs(hash).toString(36)}`;
+}
+/**
+ * Get device name based on browser and OS
+ */
+function getDeviceName() {
+    const { browser, os, deviceType } = detectDevice();
+    if (deviceType === 'mobile') {
+        return `${os} Mobile`;
+    }
+    else if (deviceType === 'tablet') {
+        return `${os} Tablet`;
+    }
+    else {
+        return `${browser} on ${os}`;
+    }
+}