@fovestta2/web-react 1.1.0

package/dist/components/AddUpdateForm.d.ts

@@ -0,0 +1,64 @@
+import React from 'react';
+export type FieldType = 'text' | 'email' | 'number' | 'select' | 'name-code' | 'checkbox' | 'textarea' | 'date' | 'password' | 'radio' | 'file' | 'month-year' | 'phone' | 'uan' | 'pf' | 'esi' | 'ifsc' | 'micr' | 'iban' | 'service-period' | 'scan' | 'document' | 'time' | 'toggle';
+export type ValidationType = 'required' | 'email' | 'minLength' | 'maxLength' | 'pattern' | 'min' | 'max' | 'custom' | 'duplicate' | 'passwordComplexity';
+export interface FieldValidation {
+    type: ValidationType;
+    value?: any;
+    message?: string;
+    errorKey?: string;
+    params?: any;
+}
+export interface FormColumn {
+    name: string;
+    label: string;
+    type: FieldType;
+    placeholder?: string;
+    required?: boolean;
+    options?: {
+        label: string;
+        value: any;
+    }[];
+    validations?: FieldValidation[];
+    value?: any;
+    disabled?: boolean | ((formData: any) => boolean);
+    className?: string;
+    hidden?: boolean;
+    hint?: string;
+    colSpan?: number;
+    onChange?: (value: any, formData: any) => void;
+    accept?: string;
+    filePreview?: boolean;
+    showTimePicker?: boolean;
+    allowAlphabetsOnly?: boolean;
+    maxLength?: number;
+    layout?: 'vertical' | 'horizontal';
+    servicePeriodConfig?: {
+        startField: string;
+        endField: string;
+    };
+}
+export interface FormSection {
+    title?: string;
+    fields: FormColumn[];
+    isRepeatable?: boolean;
+    sectionKey?: string;
+}
+export interface FormConfig {
+    sections: FormSection[];
+    submitLabel?: string;
+    resetLabel?: string;
+    onSubmit: (data: any) => void;
+    onReset?: () => void;
+    onCancel: () => void;
+    cancelLabel?: string;
+    formTitle?: string;
+    maxColsPerRow?: number;
+    disableSubmit?: boolean;
+    disableCancel?: boolean;
+    hideSubmit?: boolean;
+    hideCancel?: boolean;
+}
+export interface AddUpdateFormProps {
+    config: FormConfig;
+}
+export declare const AddUpdateForm: React.FC<AddUpdateFormProps>;

package/dist/components/AddUpdateForm.js

@@ -0,0 +1,244 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AddUpdateForm = void 0;
+const react_1 = __importStar(require("react"));
+// Import all Fv controls
+const FvEntryField_1 = require("./FvEntryField");
+const FvDropdown_1 = require("./FvDropdown");
+const FvNumberField_1 = require("./FvNumberField");
+const FvDateField_1 = require("./FvDateField");
+const FvMonthYearField_1 = require("./FvMonthYearField");
+const FvFileSelector_1 = require("./FvFileSelector");
+const FvImageSelector_1 = require("./FvImageSelector");
+const FvRichTextEditor_1 = require("./FvRichTextEditor");
+const FvNameCode_1 = require("./FvNameCode");
+const FvPhoneField_1 = require("./FvPhoneField");
+const FvUanField_1 = require("./FvUanField");
+const FvPfField_1 = require("./FvPfField");
+const FvEsiField_1 = require("./FvEsiField");
+const FvIfscField_1 = require("./FvIfscField");
+const FvMicrField_1 = require("./FvMicrField");
+const FvIbanField_1 = require("./FvIbanField");
+const FvEmailField_1 = require("./FvEmailField");
+const FvPasswordField_1 = require("./FvPasswordField");
+const FvToggle_1 = require("./FvToggle");
+const FvCheckbox_1 = require("./FvCheckbox");
+const FvRadioGroup_1 = require("./FvRadioGroup");
+const FvDocumentField_1 = require("./FvDocumentField");
+const FvTimeField_1 = require("./FvTimeField");
+const AddUpdateForm = ({ config }) => {
+    const [formData, setFormData] = (0, react_1.useState)({});
+    (0, react_1.useEffect)(() => {
+        // Initialize form structure
+        const initialData = {};
+        config.sections.forEach((section) => {
+            if (section.isRepeatable && section.sectionKey) {
+                // Init as array with one empty object
+                const groupObj = {};
+                section.fields.forEach((col) => {
+                    groupObj[col.name] = col.value || '';
+                });
+                initialData[section.sectionKey] = [groupObj];
+            }
+            else {
+                section.fields.forEach((col) => {
+                    initialData[col.name] = col.value || '';
+                });
+            }
+        });
+        setFormData(initialData);
+    }, [config]);
+    const handleFieldChange = (name, value, sectionKey, index) => {
+        setFormData((prev) => {
+            const copy = { ...prev };
+            if (sectionKey && index !== undefined) {
+                copy[sectionKey] = [...(copy[sectionKey] || [])];
+                copy[sectionKey][index] = { ...copy[sectionKey][index], [name]: value };
+            }
+            else {
+                copy[name] = value;
+            }
+            return copy;
+        });
+        // We do a delayed trigger to on change to simulate reactive form passing state
+        setTimeout(() => {
+            const col = findColumn(name, sectionKey);
+            if (col && col.onChange) {
+                // Needs recent state
+                setFormData((latestState) => {
+                    col.onChange(value, latestState);
+                    return latestState;
+                });
+            }
+        }, 0);
+    };
+    const findColumn = (name, sectionKey) => {
+        for (const section of config.sections) {
+            if (sectionKey && section.sectionKey !== sectionKey)
+                continue;
+            const col = section.fields.find(c => c.name === name);
+            if (col)
+                return col;
+        }
+        return undefined;
+    };
+    const addSectionItem = (sectionKey, fields) => {
+        setFormData((prev) => {
+            const copy = { ...prev };
+            const groupObj = {};
+            fields.forEach((col) => { groupObj[col.name] = col.value || ''; });
+            copy[sectionKey] = [...(copy[sectionKey] || []), groupObj];
+            return copy;
+        });
+    };
+    const removeSectionItem = (sectionKey, index) => {
+        setFormData((prev) => {
+            const copy = { ...prev };
+            if (copy[sectionKey] && copy[sectionKey].length > 1) {
+                const arr = [...copy[sectionKey]];
+                arr.splice(index, 1);
+                copy[sectionKey] = arr;
+            }
+            return copy;
+        });
+    };
+    const handleSubmit = (e) => {
+        e.preventDefault();
+        config.onSubmit(formData);
+    };
+    const getSchema = (column) => {
+        const rules = [];
+        const errorPriority = [];
+        if (column.validations) {
+            column.validations.forEach((v) => {
+                if (v.type === 'required') {
+                    rules.push({ name: 'required', params: { enabled: true }, errorKey: 'ERR_REQUIRED', message: v.message });
+                    errorPriority.push('required');
+                }
+                if (v.type === 'email') {
+                    rules.push({ name: 'regex', params: { pattern: '^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$' }, errorKey: 'ERR_REGEX_MISMATCH', message: v.message });
+                    errorPriority.push('regex');
+                }
+                if (v.type === 'minLength') {
+                    rules.push({ name: 'minLength', params: { value: v.value }, errorKey: 'ERR_MIN_LENGTH', message: v.message });
+                    errorPriority.push('minLength');
+                }
+                if (v.type === 'maxLength') {
+                    rules.push({ name: 'maxLength', params: { value: v.value }, errorKey: 'ERR_MAX_LENGTH', message: v.message });
+                    errorPriority.push('maxLength');
+                }
+                if (v.type === 'pattern') {
+                    rules.push({ name: 'regex', params: { pattern: v.value }, errorKey: 'ERR_REGEX_MISMATCH', message: v.message });
+                    errorPriority.push('regex');
+                }
+            });
+        }
+        return { controlType: 'EntryField', rules, errorPriority };
+    };
+    const isFieldDisabled = (column) => {
+        if (typeof column.disabled === 'function') {
+            return column.disabled(formData);
+        }
+        return column.disabled || false;
+    };
+    const renderField = (column, value, sectionKey, index) => {
+        var _a, _b;
+        const disabled = isFieldDisabled(column);
+        const schema = getSchema(column);
+        const onChange = (val) => handleFieldChange(column.name, val, sectionKey, index);
+        if (column.hidden)
+            return null;
+        switch (column.type) {
+            case 'text':
+                return react_1.default.createElement(FvEntryField_1.FvEntryField, { label: column.label, placeholder: column.placeholder, value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'email':
+                return react_1.default.createElement(FvEmailField_1.FvEmailField, { label: column.label, placeholder: column.placeholder, value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'password':
+                return react_1.default.createElement(FvPasswordField_1.FvPasswordField, { label: column.label, placeholder: column.placeholder, value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'number':
+                return react_1.default.createElement(FvNumberField_1.FvNumberField, { label: column.label, placeholder: column.placeholder, value: value || null, schema: schema, disabled: disabled, onChange: onChange });
+            case 'select':
+                return react_1.default.createElement(FvDropdown_1.FvDropdown, { label: column.label, placeholder: column.placeholder, options: column.options || [], value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'checkbox':
+                return react_1.default.createElement(FvCheckbox_1.FvCheckbox, { label: column.label, value: value || false, disabled: disabled, onChange: onChange });
+            case 'toggle':
+                return react_1.default.createElement(FvToggle_1.FvToggle, { label: column.label, value: value || false, disabled: disabled, onChange: onChange });
+            case 'radio':
+                return react_1.default.createElement(FvRadioGroup_1.FvRadioGroup, { label: column.label, options: column.options || [], value: value || '', disabled: disabled, layout: column.layout, onChange: onChange });
+            case 'date':
+                return react_1.default.createElement(FvDateField_1.FvDateField, { label: column.label, value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'month-year':
+                return react_1.default.createElement(FvMonthYearField_1.FvMonthYearField, { label: column.label, value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'textarea':
+                return react_1.default.createElement(FvRichTextEditor_1.FvRichTextEditor, { label: column.label, placeholder: column.placeholder, value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'file':
+                if (((_a = column.accept) === null || _a === void 0 ? void 0 : _a.startsWith('image')) || column.filePreview) {
+                    return react_1.default.createElement(FvImageSelector_1.FvImageSelector, { label: column.label, placeholder: column.placeholder, value: value || null, schema: schema, disabled: disabled, onChange: onChange });
+                }
+                return react_1.default.createElement(FvFileSelector_1.FvFileSelector, { label: column.label, placeholder: column.placeholder, accept: column.accept, value: value || null, schema: schema, disabled: disabled, onChange: onChange });
+            case 'name-code':
+                return react_1.default.createElement(FvNameCode_1.FvNameCode, { label: column.label, placeholder: column.placeholder, options: ((_b = column.options) === null || _b === void 0 ? void 0 : _b.map(o => ({ code: o.value, name: o.label, value: o.value }))) || [], value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'phone':
+                return react_1.default.createElement(FvPhoneField_1.FvPhoneField, { label: column.label, value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'uan':
+                return react_1.default.createElement(FvUanField_1.FvUanField, { label: column.label, value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'pf':
+                return react_1.default.createElement(FvPfField_1.FvPfField, { label: column.label, value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'esi':
+                return react_1.default.createElement(FvEsiField_1.FvEsiField, { label: column.label, value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'ifsc':
+                return react_1.default.createElement(FvIfscField_1.FvIfscField, { label: column.label, value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'micr':
+                return react_1.default.createElement(FvMicrField_1.FvMicrField, { label: column.label, value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'iban':
+                return react_1.default.createElement(FvIbanField_1.FvIbanField, { label: column.label, value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'document':
+                return react_1.default.createElement(FvDocumentField_1.FvDocumentField, { label: column.label, placeholder: column.placeholder, accept: column.accept, value: value || null, schema: schema, disabled: disabled, onChange: onChange });
+            case 'time':
+                return react_1.default.createElement(FvTimeField_1.FvTimeField, { label: column.label, placeholder: column.placeholder, value: value || '', schema: schema, disabled: disabled, onChange: onChange });
+            case 'service-period':
+                // Not perfectly mapped due to pure group dependency, simple implementation shown for continuity
+                return react_1.default.createElement(FvEntryField_1.FvEntryField, { label: column.label, value: value || '', disabled: true, onChange: onChange });
+            default:
+                return null; // unsupported
+        }
+    };
+    return (react_1.default.createElement("div", { style: { background: '#f5f5f5', padding: '15px 20px', borderRadius: '8px', maxWidth: '100%', boxSizing: 'border-box' } },
+        config.formTitle && (react_1.default.createElement("div", { style: { marginBottom: '15px' } },
+            react_1.default.createElement("h2", { style: { margin: 0, fontSize: '20px', fontWeight: 700, color: '#303030' } }, config.formTitle))),
+        react_1.default.createElement("form", { onSubmit: handleSubmit, style: { background: '#fff', padding: '15px', borderRadius: '6px', boxShadow: '0 1px 3px rgba(0,0,0,0.1)' } },
+            config.sections.map((section, sIdx) => (react_1.default.createElement("div", { key: sIdx, style: { marginBottom: '20px' } },
+                section.title && react_1.default.createElement("h3", { style: { fontSize: '16px', fontWeight: 700, color: '#303030', marginBottom: '16px', textTransform: 'uppercase' } }, section.title),
+                section.isRepeatable && section.sectionKey ? ((formData[section.sectionKey] || []).map((group, idx) => (react_1.default.createElement("div", { key: idx, style: { position: 'relative', border: '1px solid #eee', borderRadius: '8px', padding: '20px 80px 20px 20px', marginBottom: '15px', background: '#fafafa' } },
+                    react_1.default.createElement("div", { style: { position: 'absolute', top: '15px', right: '15px', display: 'flex', gap: '8px' } },
+                        react_1.default.createElement("button", { type: "button", onClick: () => addSectionItem(section.sectionKey, section.fields), style: { background: 'none', border: 'none', cursor: 'pointer', fontSize: '20px', color: '#2ecc71' } }, "\u2295"),
+                        (formData[section.sectionKey] || []).length > 1 && (react_1.default.createElement("button", { type: "button", onClick: () => removeSectionItem(section.sectionKey, idx), style: { background: 'none', border: 'none', cursor: 'pointer', fontSize: '20px', color: '#e74c3c' } }, "\u2297"))),
+                    react_1.default.createElement("div", { style: { display: 'grid', gridTemplateColumns: `repeat(auto-fit, minmax(200px, 1fr))`, gap: '16px' } }, section.fields.map((col, cIdx) => (react_1.default.createElement("div", { key: cIdx, style: { gridColumn: `span ${col.colSpan || 1}` } }, renderField(col, group[col.name], section.sectionKey, idx))))))))) : (react_1.default.createElement("div", { style: { display: 'grid', gridTemplateColumns: `repeat(auto-fit, minmax(200px, 1fr))`, gap: '16px' } }, section.fields.map((col, cIdx) => (react_1.default.createElement("div", { key: cIdx, style: { gridColumn: `span ${col.colSpan || 1}` } }, renderField(col, formData[col.name]))))))))),
+            react_1.default.createElement("div", { style: { display: 'flex', justifyContent: 'space-between', gap: '12px', marginTop: '20px' } },
+                !config.hideSubmit && (react_1.default.createElement("button", { type: "submit", disabled: config.disableSubmit, style: { padding: '8px 24px', background: config.disableSubmit ? '#bdc3c7' : '#006aff', color: '#fff', border: 'none', borderRadius: '7px', fontWeight: 600, cursor: config.disableSubmit ? 'not-allowed' : 'pointer' } }, config.submitLabel || 'Save')),
+                !config.hideCancel && (react_1.default.createElement("button", { type: "button", disabled: config.disableCancel, onClick: config.onCancel, style: { padding: '8px 24px', background: '#303030', color: '#fff', border: 'none', borderRadius: '7px', fontWeight: 600, cursor: config.disableCancel ? 'not-allowed' : 'pointer' } }, config.cancelLabel || 'Cancel'))))));
+};
+exports.AddUpdateForm = AddUpdateForm;

package/dist/components/FvCheckbox.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+export interface FvCheckboxProps {
+    label?: string;
+    value: boolean;
+    disabled?: boolean;
+    required?: boolean;
+    className?: string;
+    labelClassName?: string;
+    checkboxClassName?: string;
+    onChange: (value: boolean) => void;
+}
+export declare const FvCheckbox: React.FC<FvCheckboxProps>;

package/dist/components/FvCheckbox.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FvCheckbox = void 0;
+const react_1 = __importDefault(require("react"));
+const FvCheckbox = ({ label = '', value, disabled = false, required = false, className = '', labelClassName = '', checkboxClassName = '', onChange, }) => {
+    const handleChange = (e) => {
+        onChange(e.target.checked);
+    };
+    return (react_1.default.createElement("div", { className: `fv-checkbox-container ${className}`, style: { marginBottom: '16px', display: 'flex', alignItems: 'center' } },
+        react_1.default.createElement("label", { className: `fv-checkbox-label ${labelClassName}`, style: { display: 'flex', alignItems: 'center', cursor: disabled ? 'not-allowed' : 'pointer', fontSize: '14px', color: disabled ? '#999' : '#333' } },
+            react_1.default.createElement("input", { type: "checkbox", checked: value, onChange: handleChange, disabled: disabled, className: `fv-checkbox-input ${checkboxClassName}`, style: { marginRight: '8px', cursor: disabled ? 'not-allowed' : 'pointer' } }),
+            react_1.default.createElement("span", { className: "fv-checkbox-text" },
+                label,
+                required && react_1.default.createElement("span", { className: "fv-required-asterisk", style: { color: '#dc3545', fontWeight: 'bold' } }, " *")))));
+};
+exports.FvCheckbox = FvCheckbox;

package/dist/components/FvDateField.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { ValidationSchema } from '@fovestta2/validation-engine';
+export interface FvDateFieldProps {
+    label?: string;
+    value: string;
+    schema?: ValidationSchema;
+    disabled?: boolean;
+    readonly?: boolean;
+    min?: string;
+    max?: string;
+    className?: string;
+    inputClassName?: string;
+    labelClassName?: string;
+    errorClassName?: string;
+    onChange: (value: string) => void;
+    onBlur?: () => void;
+    onFocus?: () => void;
+}
+export declare const FvDateField: React.FC<FvDateFieldProps>;

package/dist/components/FvDateField.js

@@ -0,0 +1,123 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FvDateField = void 0;
+const react_1 = __importStar(require("react"));
+const validation_engine_1 = require("@fovestta2/validation-engine");
+const FvDateField = ({ label = '', value, schema, disabled = false, readonly = false, min, max, className = '', inputClassName = '', labelClassName = '', errorClassName = '', onChange, onBlur, onFocus, }) => {
+    const [errorMessage, setErrorMessage] = (0, react_1.useState)(null);
+    const [derivedMin, setDerivedMin] = (0, react_1.useState)(min);
+    const [derivedMax, setDerivedMax] = (0, react_1.useState)(max);
+    (0, react_1.useEffect)(() => {
+        extractConstraintsFromSchema();
+    }, [schema, min, max]);
+    (0, react_1.useEffect)(() => {
+        validateValue(value);
+    }, [value, schema]);
+    const formatDate = (date) => {
+        if (!date)
+            return undefined;
+        const d = new Date(date);
+        if (isNaN(d.getTime()))
+            return undefined;
+        return d.toISOString().split('T')[0];
+    };
+    const extractConstraintsFromSchema = () => {
+        var _a, _b;
+        let newMin = min;
+        let newMax = max;
+        if (schema === null || schema === void 0 ? void 0 : schema.rules) {
+            for (const rule of schema.rules) {
+                if (rule.name === 'minDate' && !newMin) {
+                    newMin = formatDate((_a = rule.params) === null || _a === void 0 ? void 0 : _a['value']);
+                }
+                if (rule.name === 'maxDate' && !newMax) {
+                    newMax = formatDate((_b = rule.params) === null || _b === void 0 ? void 0 : _b['value']);
+                }
+            }
+        }
+        setDerivedMin(newMin);
+        setDerivedMax(newMax);
+    };
+    const validateValue = (val) => {
+        if (!schema)
+            return;
+        const result = validation_engine_1.Validator.validate(val, schema);
+        if (!result.isValid && result.errorKey) {
+            setErrorMessage(result.errorKey);
+        }
+        else {
+            setErrorMessage(null);
+        }
+    };
+    const handleInput = (e) => {
+        onChange(e.target.value);
+    };
+    const handleBlur = (e) => {
+        validateValue(value);
+        if (onBlur)
+            onBlur();
+    };
+    const handleFocus = (e) => {
+        if (onFocus)
+            onFocus();
+    };
+    const isRequired = () => {
+        var _a;
+        return ((_a = schema === null || schema === void 0 ? void 0 : schema.rules) === null || _a === void 0 ? void 0 : _a.some((r) => { var _a; return r.name === 'required' && ((_a = r.params) === null || _a === void 0 ? void 0 : _a['enabled']); })) || false;
+    };
+    const getErrorMessage = () => {
+        if (!errorMessage)
+            return '';
+        const errorMessages = {
+            ERR_REQUIRED: 'Date is required',
+            ERR_MIN_DATE: `Date must be after ${derivedMin}`,
+            ERR_MAX_DATE: `Date must be before ${derivedMax}`,
+            ERR_MIN_AGE: 'Age requirement not met (too young)',
+            ERR_MAX_AGE: 'Age requirement not met (too old)',
+        };
+        return errorMessages[errorMessage] || errorMessage;
+    };
+    return (react_1.default.createElement("div", { className: `fv-field-container ${className}`, style: { marginBottom: '16px', display: 'flex', flexDirection: 'column' } },
+        label && (react_1.default.createElement("label", { className: `fv-label ${labelClassName}`, style: { marginBottom: '6px', fontSize: '14px', fontWeight: 500, color: disabled ? '#999' : '#333' } },
+            label,
+            isRequired() && react_1.default.createElement("span", { className: "fv-required", style: { color: '#dc3545', fontWeight: 'bold' } }, " *"))),
+        react_1.default.createElement("input", { type: "date", value: value, onChange: handleInput, onBlur: handleBlur, onFocus: handleFocus, disabled: disabled, readOnly: readonly, min: derivedMin, max: derivedMax, className: `fv-input ${errorMessage ? 'fv-input-error' : ''} ${inputClassName}`, style: {
+                padding: '10px',
+                border: errorMessage ? '1px solid #dc3545' : '1px solid #ccc',
+                borderRadius: '4px',
+                fontSize: '14px',
+                backgroundColor: disabled ? '#f5f5f5' : '#fff',
+                cursor: disabled ? 'not-allowed' : 'text',
+                outline: 'none',
+                boxSizing: 'border-box',
+                width: '100%',
+                ...((disabled || readonly) ? { opacity: 0.6 } : {})
+            } }),
+        errorMessage && (react_1.default.createElement("span", { className: `fv-error-text ${errorClassName}`, style: { marginTop: '4px', fontSize: '12px', color: '#dc3545' } },
+            "\u26A0 ",
+            getErrorMessage()))));
+};
+exports.FvDateField = FvDateField;

package/dist/components/FvDocumentField.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import { ValidationSchema } from '@fovestta2/validation-engine';
+export interface FileInfo {
+    file: File | string;
+    name: string;
+    size?: number;
+    type: string;
+}
+export interface FvDocumentFieldProps {
+    label?: string;
+    placeholder?: string;
+    value: FileInfo | null;
+    schema?: ValidationSchema;
+    disabled?: boolean;
+    accept?: string;
+    maxSize?: number;
+    className?: string;
+    errorClassName?: string;
+    onChange: (value: FileInfo | null) => void;
+    onBlur?: () => void;
+}
+export declare const FvDocumentField: React.FC<FvDocumentFieldProps>;