form-preview-df/dist/index.d.ts

Resusable Form Preview Components

import React from 'react';

interface ICondition$1 {
    id: string;
    when: string;
    operator: 'equals' | 'notEquals' | 'isEmpty' | 'isNotEmpty' | 'contains' | 'notContains' | 'greaterThan' | 'lessThan' | 'greaterThanOrEqual' | 'lessThanOrEqual';
    value: string | number | boolean;
}
interface IConditionalLogic$2 {
    action: 'show' | 'hide' | 'always';
    when: 'all' | 'any';
    conditions: ICondition$1[];
}
interface IFormControlChange {
    id: string;
    value: any;
    isValid?: boolean;
    errors?: Record<string, any>;
    comments?: string;
}
interface IFormValidationErrors {
    [key: string]: any;
}
type TInputComponentType$1 = 'text' | 'number' | 'email' | 'password' | 'url' | 'tel';
interface IBaseFormComponent {
    id: string;
    _id: string;
    name: string;
    category: string;
    basic: {
        label: string;
        value: string;
        defaultValue: string;
        placeholder: string;
        options: any[];
        description?: string;
        collapsed?: boolean;
        showLabel?: boolean;
    };
    validation: {
        required: boolean;
        readonly: boolean;
        customValidationMessage: string;
        minLength?: number;
        maxLength?: number;
        min?: number;
        max?: number;
        pattern?: string;
        customValidation?: string;
        minDate?: string;
        maxDate?: string;
    };
    styles: {
        labelAlignment: 'left' | 'top';
        width?: number;
        height?: number;
        minWidth?: number;
        maxWidth?: number;
        minHeight?: number;
        maxHeight?: number;
        column?: number;
        fontSize?: string;
        color?: string;
        backgroundColor?: string;
        borderColor?: string;
        borderWidth?: string;
        borderRadius?: string;
        padding?: string;
        margin?: string;
    };
    position: number;
    options: any[];
    conditional: IConditionalLogic$2;
}
interface ITextInputComponent$1 extends IBaseFormComponent {
    name: 'text-input';
    validation: IBaseFormComponent['validation'] & {
        minLength?: number;
        maxLength?: number;
        pattern?: string;
    };
}
interface INumberInputComponent$1 extends IBaseFormComponent {
    name: 'number-input';
    validation: IBaseFormComponent['validation'] & {
        min?: number;
        max?: number;
        step?: number;
        minLength?: number;
        maxLength?: number;
    };
}
interface IEmailInputComponent$1 extends IBaseFormComponent {
    name: 'email-input';
    validation: IBaseFormComponent['validation'] & {
        pattern?: string;
    };
}
interface ITextareaComponent extends IBaseFormComponent {
    name: 'textarea';
    validation: IBaseFormComponent['validation'] & {
        minLength?: number;
        maxLength?: number;
        rows?: number;
    };
}
interface ISelectComponent extends IBaseFormComponent {
    name: 'select';
    options: Array<{
        label: string;
        value: string;
        disabled?: boolean;
    }>;
    validation: IBaseFormComponent['validation'] & {
        multiple?: boolean;
    };
    basic: IBaseFormComponent['basic'] & {
        comments?: string;
    };
}
interface IRadioComponent extends IBaseFormComponent {
    name: 'radio';
    options: Array<{
        label: string;
        value: string;
        disabled?: boolean;
    }>;
    validation: IBaseFormComponent['validation'];
    basic: IBaseFormComponent['basic'] & {
        inlineLayout?: boolean;
        comments?: string;
    };
}
interface ICheckboxComponent extends IBaseFormComponent {
    name: 'checkbox';
    options: Array<{
        label: string;
        value: string;
        disabled?: boolean;
    }>;
    validation: IBaseFormComponent['validation'] & {
        multiple?: boolean;
    };
    basic: IBaseFormComponent['basic'] & {
        inlineLayout?: boolean;
        comments?: string;
    };
}
interface ISegmentComponent extends IBaseFormComponent {
    name: 'segment';
    options: Array<{
        label: string;
        value: string;
        disabled?: boolean;
    }>;
    validation: IBaseFormComponent['validation'];
    basic: IBaseFormComponent['basic'] & {
        inlineLayout?: boolean;
        comments?: string;
    };
}
interface IDateComponent extends IBaseFormComponent {
    name: 'date';
    validation: IBaseFormComponent['validation'] & {
        minDate?: string;
        maxDate?: string;
    };
}
interface IDatePickerComponent$1 extends IBaseFormComponent {
    name: 'date-picker';
    validation: IBaseFormComponent['validation'] & {
        minDate?: string;
        maxDate?: string;
    };
}
interface IDateTimePickerComponent$1 extends IBaseFormComponent {
    name: 'datetime-picker';
    validation: IBaseFormComponent['validation'] & {
        minDate?: string;
        maxDate?: string;
    };
}
interface IFileComponent$1 extends IBaseFormComponent {
    name: 'file';
    validation: IBaseFormComponent['validation'] & {
        accept?: string;
        maxSize?: number;
        multiple?: boolean;
    };
}
interface IFileUploadComponent extends IBaseFormComponent {
    name: 'file-upload';
    validation: IBaseFormComponent['validation'] & {
        accept?: string;
        maxSize?: number;
        multiple?: boolean;
        maxFiles?: number;
        allowedTypes?: string[];
    };
}
interface ILocationComponent$1 extends IBaseFormComponent {
    name: 'location';
    validation: IBaseFormComponent['validation'] & {
        enableHighAccuracy?: boolean;
        timeout?: number;
        maximumAge?: number;
    };
}
interface IHeadingComponent$1 extends Omit<IBaseFormComponent, 'basic' | 'styles'> {
    name: 'heading';
    basic: {
        label: string;
        level?: 1 | 2 | 3 | 4 | 5 | 6;
    };
    styles?: {
        fontSize?: string;
        color?: string;
        textAlign?: 'left' | 'center' | 'right';
    };
}
interface IDividerComponent extends Omit<IBaseFormComponent, 'styles'> {
    name: 'divider';
    styles?: {
        color?: string;
        thickness?: string;
        style?: 'solid' | 'dashed' | 'dotted';
    };
}
interface IInstructionComponent$1 extends Omit<IBaseFormComponent, 'basic' | 'validation'> {
    name: 'instructions';
    basic: {
        label?: string;
        instructions: string[];
        value?: string;
        defaultValue?: string;
        placeholder?: string;
        options?: any[];
        description?: string;
        collapsed?: boolean;
        showLabel?: boolean;
    };
    validation: IBaseFormComponent['validation'] & {
        listStyle?: 'none' | 'numbers' | 'bullets' | 'alpha';
    };
}
interface ISignatureComponent extends IBaseFormComponent {
    name: 'signature';
    validation: IBaseFormComponent['validation'] & {
        required?: boolean;
    };
}
interface ISectionComponent$1 extends Omit<IBaseFormComponent, 'basic' | 'styles'> {
    name: 'section';
    basic: {
        label: string;
        description: string;
        collapsed: boolean;
    };
    children: FormComponentType[];
    styles: IBaseFormComponent['styles'] & {
        backgroundColor: string;
        borderColor: string;
        borderWidth: string;
        borderRadius: string;
        padding: string;
        margin: string;
    };
}
interface ITableComponent$1 extends Omit<IBaseFormComponent, 'basic' | 'styles'> {
    name: 'table';
    basic: {
        label: string;
        description: string;
        rows: number;
        columns: number;
    };
    table: {
        rows: number;
        columns: number;
        displayAsTable: boolean;
        columnNames: string;
        showColumns: boolean;
    };
    cells: TableCell[][];
    styles: IBaseFormComponent['styles'] & {
        backgroundColor: string;
        borderColor: string;
        borderWidth: string;
        borderRadius: string;
        padding: string;
        margin: string;
        headerBackgroundColor?: string;
        headerTextColor?: string;
    };
}
interface IDataGridComponent$1 extends Omit<IBaseFormComponent, 'basic' | 'styles'> {
    name: 'datagrid';
    basic: {
        label: string;
        description: string;
        collapsed?: boolean;
    };
    datagrid: {
        maxEntries: number;
        minEntries: number;
        allowAddRemoveEntries: boolean;
        addAnotherText: string;
        removeText: string;
        displayAsGrid: boolean;
    };
    templateComponents: FormComponentType[];
    entries: DataGridEntry[];
    styles: IBaseFormComponent['styles'] & {
        backgroundColor: string;
        borderColor: string;
        borderWidth: string;
        borderRadius: string;
        padding: string;
        margin: string;
    };
}
interface DataGridEntry {
    id: string;
    index: number;
    components: FormComponentType[];
    styles?: {
        backgroundColor?: string;
        borderColor?: string;
        padding?: string;
        minHeight?: string;
        verticalAlign?: 'top' | 'middle' | 'bottom';
    };
}
interface TableCell {
    id: string;
    row: number;
    column: number;
    components: FormComponentType[];
    styles?: {
        backgroundColor?: string;
        borderColor?: string;
        padding?: string;
        minHeight?: string;
        verticalAlign?: 'top' | 'middle' | 'bottom';
    };
}
type FormComponentType = ITextInputComponent$1 | INumberInputComponent$1 | IEmailInputComponent$1 | ITextareaComponent | ISelectComponent | IRadioComponent | ICheckboxComponent | ISegmentComponent | IDateComponent | IDatePickerComponent$1 | IDateTimePickerComponent$1 | IFileComponent$1 | IFileUploadComponent | ILocationComponent$1 | IHeadingComponent$1 | IDividerComponent | IInstructionComponent$1 | ISignatureComponent | ISectionComponent$1 | ITableComponent$1 | IDataGridComponent$1;
interface FormComponentProps {
    id: string;
    properties: FormComponentType;
    validationErrors?: IFormValidationErrors;
    formValue?: any;
    inputType?: TInputComponentType$1;
    readonly?: boolean;
    disabled?: boolean;
    touchedFields?: Record<string, boolean>;
    formSubmitted?: boolean;
    mode?: 'edit' | 'preview' | 'test';
    onValueChange?: (change: IFormControlChange) => void;
    onBlur?: () => void;
    onFocus?: () => void;
    onSelect?: () => void;
    isSelected?: boolean;
    className?: string;
    hideLabel?: boolean;
}
interface ErrorMessageProps {
    validationErrors: IFormValidationErrors;
    fieldId: string;
    control?: any;
    inputType?: TInputComponentType$1;
    touchedFields: Record<string, boolean>;
    formSubmitted: boolean;
    properties: FormComponentType;
    localValidation?: {
        isValid: boolean;
        errors: Record<string, any>;
    };
    isTouched?: boolean;
    mode?: 'edit' | 'preview' | 'test';
}
interface ValidationRule {
    type: 'required' | 'minLength' | 'maxLength' | 'min' | 'max' | 'pattern' | 'email' | 'custom';
    value?: any;
    message?: string;
}
interface ValidationResult {
    isValid: boolean;
    errors: Record<string, string>;
}

type DeviceType = 'desktop' | 'tablet' | 'mobile';
interface DfFormPreviewProps {
    formComponents: FormComponentType[];
    formData?: any;
    currentDevice?: DeviceType;
    isPreviewMode?: boolean;
    initialFormData?: FormComponentType[];
    onSubmit?: (formData: FormComponentType[]) => void;
    onFormDataChange?: (formData: FormComponentType[]) => void;
    formTitle?: string;
    formDescription?: string;
    onComponentSelect?: (component: FormComponentType) => void;
    onComponentDelete?: (component: FormComponentType, event: React.MouseEvent) => void;
    onComponentEdit?: (component: FormComponentType) => void;
    onComponentUpdate?: (componentId: string, updates: Partial<FormComponentType>) => void;
    selectedComponent?: FormComponentType | null;
}
declare const DfFormPreview: React.FC<DfFormPreviewProps>;

interface DfFormInputProps {
    id: string;
    properties: ITextInputComponent$1 | INumberInputComponent$1 | IEmailInputComponent$1;
    validationErrors?: IFormValidationErrors;
    formValue?: string;
    inputType?: TInputComponentType$1;
    readonly?: boolean;
    disabled?: boolean;
    touchedFields?: Record<string, boolean>;
    formSubmitted?: boolean;
    mode?: 'edit' | 'preview' | 'test';
    onValueChange?: (change: IFormControlChange) => void;
    onBlur?: () => void;
    onFocus?: () => void;
    className?: string;
    hideLabel?: boolean;
}
declare const DfFormInput: React.FC<DfFormInputProps>;

interface DfFormCheckboxProps {
    id: string;
    properties: ICheckboxComponent;
    validationErrors?: IFormValidationErrors;
    formValue?: string[];
    readonly?: boolean;
    disabled?: boolean;
    touchedFields?: Record<string, boolean>;
    formSubmitted?: boolean;
    mode?: 'edit' | 'preview' | 'test';
    onValueChange?: (change: IFormControlChange) => void;
    onBlur?: () => void;
    onFocus?: () => void;
    className?: string;
    hideLabel?: boolean;
    showCommentsInPreview?: boolean;
}
declare const DfFormCheckbox: React.FC<DfFormCheckboxProps>;

interface DfFormRadioProps {
    id: string;
    properties: IRadioComponent;
    validationErrors?: IFormValidationErrors;
    formValue?: string;
    readonly?: boolean;
    disabled?: boolean;
    touchedFields?: Record<string, boolean>;
    formSubmitted?: boolean;
    mode?: 'edit' | 'preview' | 'test';
    onValueChange?: (change: IFormControlChange) => void;
    onBlur?: () => void;
    onFocus?: () => void;
    className?: string;
    hideLabel?: boolean;
    showCommentsInPreview?: boolean;
}
declare const DfFormRadio: React.FC<DfFormRadioProps>;

interface DfFormSegmentProps {
    id: string;
    properties: ISegmentComponent;
    validationErrors?: IFormValidationErrors;
    formValue?: string;
    readonly?: boolean;
    disabled?: boolean;
    touchedFields?: Record<string, boolean>;
    formSubmitted?: boolean;
    mode?: 'edit' | 'preview' | 'test';
    onValueChange?: (change: IFormControlChange) => void;
    onBlur?: () => void;
    onFocus?: () => void;
    className?: string;
    hideLabel?: boolean;
    showCommentsInPreview?: boolean;
}
declare const DfFormSegment: React.FC<DfFormSegmentProps>;

interface DfFormSelectProps {
    id: string;
    properties: ISelectComponent;
    validationErrors?: IFormValidationErrors;
    formValue?: string | string[];
    readonly?: boolean;
    disabled?: boolean;
    touchedFields?: Record<string, boolean>;
    formSubmitted?: boolean;
    mode?: 'edit' | 'preview' | 'test';
    onValueChange?: (change: IFormControlChange) => void;
    onBlur?: () => void;
    onFocus?: () => void;
    className?: string;
    hideLabel?: boolean;
    showCommentsInPreview?: boolean;
}
declare const DfFormSelect: React.FC<DfFormSelectProps>;

interface DfFormTextareaProps {
    id: string;
    properties: ITextareaComponent;
    validationErrors?: IFormValidationErrors;
    formValue?: string;
    readonly?: boolean;
    disabled?: boolean;
    touchedFields?: Record<string, boolean>;
    formSubmitted?: boolean;
    mode?: 'edit' | 'preview' | 'test';
    onValueChange?: (change: IFormControlChange) => void;
    onBlur?: () => void;
    onFocus?: () => void;
    className?: string;
    hideLabel?: boolean;
}
declare const DfFormTextarea: React.FC<DfFormTextareaProps>;

interface DfFormDateTimeProps {
    id: string;
    properties: IDateComponent;
    validationErrors?: IFormValidationErrors;
    formValue?: string;
    readonly?: boolean;
    disabled?: boolean;
    touchedFields?: Record<string, boolean>;
    formSubmitted?: boolean;
    mode?: 'edit' | 'preview' | 'test';
    onValueChange?: (change: IFormControlChange) => void;
    onBlur?: () => void;
    onFocus?: () => void;
    className?: string;
    hideLabel?: boolean;
}
declare const DfFormDateTime: React.FC<DfFormDateTimeProps>;

interface DfFormHeadingProps {
    id: string;
    properties: IHeadingComponent$1;
    mode?: 'edit' | 'preview' | 'test';
    className?: string;
    hideLabel?: boolean;
}
declare const DfFormHeading: React.FC<DfFormHeadingProps>;

interface DfFormSignatureProps {
    id: string;
    properties: ISignatureComponent;
    validationErrors?: IFormValidationErrors;
    formValue?: string;
    readonly?: boolean;
    disabled?: boolean;
    touchedFields?: Record<string, boolean>;
    formSubmitted?: boolean;
    mode?: 'edit' | 'preview' | 'test';
    onValueChange?: (change: IFormControlChange) => void;
    onBlur?: () => void;
    onFocus?: () => void;
    className?: string;
    hideLabel?: boolean;
}
declare const DfFormSignature: React.FC<DfFormSignatureProps>;

interface IFileDataObject {
    name?: string;
    fileName?: string;
    type?: string;
    fileType?: string;
    mimeType?: string;
    size?: number;
    fileSize?: number;
    url?: string;
    path?: string;
    data?: string;
}
interface DfFormFileUploadProps {
    id: string;
    properties: IFileUploadComponent;
    validationErrors?: IFormValidationErrors;
    formValue?: File[] | FileList | IFileDataObject[] | string[] | null;
    readonly?: boolean;
    disabled?: boolean;
    touchedFields?: Record<string, boolean>;
    formSubmitted?: boolean;
    mode?: 'edit' | 'preview' | 'test';
    onValueChange?: (change: IFormControlChange) => void;
    onBlur?: () => void;
    onFocus?: () => void;
    className?: string;
    hideLabel?: boolean;
}
declare const DfFormFileUpload: React.FC<DfFormFileUploadProps>;

interface DfFormLocationProps {
    id: string;
    properties: ILocationComponent$1;
    validationErrors?: IFormValidationErrors;
    formValue?: ILocationData | null;
    readonly?: boolean;
    disabled?: boolean;
    touchedFields?: Record<string, boolean>;
    formSubmitted?: boolean;
    mode?: 'edit' | 'preview' | 'test';
    onValueChange?: (change: IFormControlChange) => void;
    onBlur?: () => void;
    onFocus?: () => void;
    className?: string;
    hideLabel?: boolean;
}
interface ILocationData {
    latitude: number;
    longitude: number;
    accuracy?: number;
    timestamp?: number;
    address?: string;
    placeName?: string;
    city?: string;
    country?: string;
}
declare const DfFormLocation: React.FC<DfFormLocationProps>;

interface DfFormInstructionProps {
    id: string;
    properties: IInstructionComponent$1;
    mode?: 'edit' | 'preview' | 'test';
    onValueChange?: (change: IFormControlChange) => void;
    className?: string;
    hideLabel?: boolean;
}
declare const DfFormInstruction: React.FC<DfFormInstructionProps>;

interface DfFormSectionProps {
    id: string;
    properties: ISectionComponent$1;
    validationErrors?: Record<string, any>;
    formValue?: any;
    formData?: Record<string, any>;
    readonly?: boolean;
    disabled?: boolean;
    touchedFields?: Record<string, boolean>;
    formSubmitted?: boolean;
    mode?: 'edit' | 'preview' | 'test';
    onValueChange?: (change: IFormControlChange) => void;
    onBlur?: () => void;
    onFocus?: () => void;
    onSelect?: () => void;
    isSelected?: boolean;
    className?: string;
    onSectionSelect?: (section: ISectionComponent$1) => void;
    onSectionDelete?: (sectionId: string) => void;
    onChildrenChange?: (children: FormComponentType[]) => void;
    onChildSelect?: (child: FormComponentType) => void;
    onChildDelete?: (childId: string) => void;
    selectedChild?: FormComponentType | null;
    renderFormComponent?: (field: FormComponentType) => React.ReactNode;
}
declare const DfFormSection: React.FC<DfFormSectionProps>;

interface DfFormDataGridProps {
    id: string;
    properties: IDataGridComponent$1;
    validationErrors?: Record<string, any>;
    formValue?: any;
    formData?: Record<string, any>;
    readonly?: boolean;
    disabled?: boolean;
    touchedFields?: Record<string, boolean>;
    formSubmitted?: boolean;
    mode?: 'edit' | 'preview' | 'test';
    onValueChange?: (change: IFormControlChange) => void;
    onBlur?: () => void;
    onFocus?: () => void;
    onSelect?: () => void;
    isSelected?: boolean;
    className?: string;
    onDataGridSelect?: (dataGrid: IDataGridComponent$1) => void;
    onDataGridDelete?: (dataGridId: string) => void;
    onEntryChange?: (entryIndex: number, components: FormComponentType[]) => void;
    onComponentSelect?: (component: FormComponentType) => void;
    onComponentDelete?: (component: FormComponentType, event: React.MouseEvent) => void;
    onComponentEdit?: (component: FormComponentType) => void;
    onComponentUpdate?: (componentId: string, updates: Partial<FormComponentType>) => void;
    selectedComponent?: FormComponentType | null;
    renderFormComponent?: (field: FormComponentType, hideLabel?: boolean) => React.ReactNode;
    onDataGridUpdate?: (dataGridId: string, updates: Partial<IDataGridComponent$1>) => void;
    onEntryAdd?: () => void;
    onEntryRemove?: (entryIndex: number) => void;
}
declare const DfFormDataGrid: React.FC<DfFormDataGridProps>;

type TComponentCategory = 'Basic' | 'Advanced' | 'Layout' | 'Custom';
type TBasicComponentName = 'text-input' | 'number-input' | 'email-input' | 'textarea' | 'select' | 'checkbox' | 'radio' | 'segment' | 'date-picker' | 'datetime-picker' | 'info' | 'signature' | 'heading' | 'instructions' | 'section' | 'table' | 'datagrid' | 'file' | 'location';
type TComponentName = TBasicComponentName;
declare enum ELabelAlignment {
    Top = "top",
    Left = "left"
}
interface IOption {
    label: string;
    value: string;
    selected?: boolean;
}
type TCheckboxValue = string | string[];
interface IBaseProps {
    label: string;
    value: string;
    defaultValue: string | number;
    placeholder?: string;
    options?: any[];
    description?: string;
    collapsed?: boolean;
    valid?: boolean;
}
interface IBaseValidationProps {
    required: boolean;
    customValidationMessage: string;
    readonly: boolean;
}
interface IBaseStyleProps {
    labelAlignment: ELabelAlignment;
    width?: number;
    height?: number;
    minWidth?: number;
    maxWidth?: number;
    minHeight?: number;
    maxHeight?: number;
    column?: number;
    backgroundColor?: string;
    borderColor?: string;
    borderWidth?: string;
    borderRadius?: string;
    padding?: string;
    margin?: string;
}
type TInputComponentType = 'text' | 'number' | 'email';
interface IBaseInputComponent extends IBaseComponent {
    inputType: TInputComponentType;
}
interface IBaseComponent {
    id: string;
    _id: string;
    name: TComponentName;
    category: TComponentCategory;
    basic: IBaseProps;
    validation: IBaseValidationProps;
    styles: IBaseStyleProps;
    position: number;
    options: any[];
    conditional: IConditionalLogic$1;
}
interface ITextInputBasicProps extends IBaseProps {
    placeholder: string;
    defaultValue: string;
}
interface ITextInputValidationProps extends IBaseValidationProps {
    minLength: number;
    maxLength: number;
    pattern: string;
}
interface ITextInputStyleProps extends IBaseStyleProps {
    labelAlignment: ELabelAlignment;
}
interface ITextInputComponent extends IBaseInputComponent {
    id: string;
    name: 'text-input';
    category: TComponentCategory;
    inputType: TInputComponentType;
    basic: ITextInputBasicProps;
    validation: ITextInputValidationProps;
    styles: ITextInputStyleProps;
}
interface INumberInputBasicProps extends IBaseProps {
    placeholder: string;
    defaultValue: number;
    decimalPlaces: number;
}
interface INumberInputValidationProps extends IBaseValidationProps {
    minLength: number;
    maxLength: number;
    integerOnly: boolean;
}
interface INumberInputStyleProps extends IBaseStyleProps {
    labelAlignment: ELabelAlignment;
}
interface INumberInputComponent extends IBaseInputComponent {
    id: string;
    name: 'number-input';
    inputType: 'number';
    basic: INumberInputBasicProps;
    validation: INumberInputValidationProps;
    styles: INumberInputStyleProps;
}
interface IEmailInputBasicProps extends IBaseProps {
    placeholder: string;
    defaultValue: string;
}
interface IEmailInputValidationProps extends IBaseValidationProps {
    minLength: number;
    maxLength: number;
}
interface IEmailInputStyleProps extends IBaseStyleProps {
    labelAlignment: ELabelAlignment;
}
interface IEmailInputComponent extends IBaseInputComponent {
    id: string;
    name: 'email-input';
    inputType: 'email';
    basic: IEmailInputBasicProps;
    validation: IEmailInputValidationProps;
    styles: IEmailInputStyleProps;
}
interface ITextareaInputBasicProps extends IBaseProps {
    placeholder: string;
    defaultValue: string;
    rows: number;
    autoExpand?: boolean;
}
interface ITextareaInputValidationProps extends IBaseValidationProps {
    minLength: number;
    maxLength: number;
}
interface ITextareaInputComponent extends IBaseComponent {
    id: string;
    name: 'textarea';
    category: TComponentCategory;
    basic: ITextareaInputBasicProps;
    validation: ITextareaInputValidationProps;
    styles: IBaseStyleProps;
}
interface ISelectInputBasicProps extends IBaseProps {
    placeholder: string;
    options: IOption[];
}
interface ISelectInputComponent extends IBaseComponent {
    id: string;
    name: 'select';
    category: TComponentCategory;
    basic: ISelectInputBasicProps;
    validation: IBaseValidationProps;
    styles: IBaseStyleProps;
}
interface ICheckboxGroupBasicProps extends Omit<IBaseProps, 'value' | 'defaultValue'> {
    options: IOption[];
    value: TCheckboxValue;
    defaultValue: TCheckboxValue;
    inlineLayout: boolean;
}
interface ICheckboxGroupBase extends Omit<IBaseComponent, 'basic'> {
    basic: ICheckboxGroupBasicProps;
}
interface ICheckboxGroupValidationProps extends IBaseValidationProps {
    minCheckedNumber: number;
    maxCheckedNumber: number;
}
interface ICheckboxGroupComponent extends ICheckboxGroupBase {
    id: string;
    name: 'checkbox';
    category: TComponentCategory;
    basic: ICheckboxGroupBasicProps;
    validation: ICheckboxGroupValidationProps;
    styles: IBaseStyleProps;
}
interface IRadioGroupBasicProps extends IBaseProps {
    options: IOption[];
    defaultValue: string;
    inlineLayout: boolean;
}
interface IRadioGroupComponent extends IBaseComponent {
    id: string;
    name: 'radio';
    category: TComponentCategory;
    basic: IRadioGroupBasicProps;
    validation: IBaseValidationProps;
    styles: IBaseStyleProps;
}
interface ISegmentGroupBasicProps extends IBaseProps {
    options: IOption[];
    defaultValue: string;
    inlineLayout: boolean;
}
interface ISegmentGroupComponent extends IBaseComponent {
    id: string;
    name: 'segment';
    category: TComponentCategory;
    basic: ISegmentGroupBasicProps;
    validation: IBaseValidationProps;
    styles: IBaseStyleProps;
}
interface IDateTimePickerBasicProps extends IBaseProps {
    placeholder: string;
    defaultValue: string;
    timeFormat: '12hr' | '24hr';
    minDateTime: string;
    maxDateTime: string;
}
interface IDateTimePickerComponent extends IBaseComponent {
    id: string;
    name: 'datetime-picker';
    category: TComponentCategory;
    basic: IDateTimePickerBasicProps;
    validation: IBaseValidationProps;
    styles: IBaseStyleProps;
}
interface IDatePickerBasicProps extends IBaseProps {
    placeholder: string;
    defaultValue: string;
    timeFormat: '12hr' | '24hr';
    minDate: string;
    maxDate: string;
}
interface IDatePickerComponent extends IBaseComponent {
    id: string;
    name: 'date-picker';
    category: TComponentCategory;
    basic: IDatePickerBasicProps;
    validation: IBaseValidationProps;
    styles: IBaseStyleProps;
}
interface ISignatureInputBasicProps extends IBaseProps {
    height: number;
    penColor: string;
    backgroundColor: string;
}
interface ISignatureInputComponent extends IBaseComponent {
    id: string;
    name: 'signature';
    category: TComponentCategory;
    basic: ISignatureInputBasicProps;
    validation: IBaseValidationProps;
    styles: IBaseStyleProps;
}
interface IHeadingBasicProps extends IBaseProps {
}
interface IHeadingComponent extends IBaseComponent {
    id: string;
    name: 'heading';
    category: TComponentCategory;
    basic: IHeadingBasicProps;
}
interface IInstructionBasicProps extends IBaseProps {
    instructions?: string[];
}
interface IInstructionComponent extends IBaseComponent {
    id: string;
    name: 'instructions';
    category: TComponentCategory;
    basic: IInstructionBasicProps;
    validation: IBaseValidationProps & {
        listStyle?: 'none' | 'numbers' | 'bullets' | 'alpha';
    };
}
interface ISectionBasicProps extends IBaseProps {
    description?: string;
    collapsed?: boolean;
}
interface ISectionComponent extends IBaseComponent {
    id: string;
    name: 'section';
    category: TComponentCategory;
    basic: ISectionBasicProps;
    children: TFormComponent[];
}
interface ITableBasicProps extends IBaseProps {
    description?: string;
    collapsed?: boolean;
    rows?: number;
    columns?: number;
}
interface ITableComponent extends IBaseComponent {
    id: string;
    name: 'table';
    category: TComponentCategory;
    basic: ITableBasicProps;
    table: {
        rows: number;
        columns: number;
        addAnotherText?: string;
        removeText?: string;
        displayAsTable: boolean;
        columnNames: string;
        showColumns: boolean;
    };
    cells: Array<Array<{
        id: string;
        row: number;
        column: number;
        components: TFormComponent[];
        styles?: {
            backgroundColor?: string;
            borderColor?: string;
            padding?: string;
            minHeight?: string;
            verticalAlign?: 'top' | 'middle' | 'bottom';
        };
    }>>;
}
interface IDataGridComponent extends IBaseComponent {
    id: string;
    name: 'datagrid';
    category: TComponentCategory;
    basic: IBaseProps;
    datagrid: {
        maxEntries?: number;
        minEntries?: number;
        allowAddRemoveEntries?: boolean;
        addAnotherText?: string;
        removeText?: string;
        displayAsGrid?: boolean;
    };
    entries: Array<{
        id: string;
        index: number;
        components: TFormComponent[];
        styles?: {
            backgroundColor?: string;
            borderColor?: string;
            padding?: string;
            minHeight?: string;
            verticalAlign?: 'top' | 'middle' | 'bottom';
        };
    }>;
}
interface ICondition {
    id: string;
    when: string;
    operator: 'equals' | 'notEquals' | 'isEmpty' | 'isNotEmpty' | 'contains' | 'notContains' | 'greaterThan' | 'lessThan' | 'greaterThanOrEqual' | 'lessThanOrEqual';
    value: string | number | boolean;
}
interface IConditionalLogic$1 {
    action: 'show' | 'hide' | 'always';
    when: 'all' | 'any';
    conditions: ICondition[];
}
interface IFileComponent extends IBaseComponent {
    id: string;
    name: 'file';
    category: TComponentCategory;
    basic: IBaseProps;
    validation: IBaseValidationProps;
    styles: IBaseStyleProps;
}
interface ILocationComponent extends IBaseComponent {
    id: string;
    name: 'location';
    category: TComponentCategory;
    basic: IBaseProps;
    validation: IBaseValidationProps;
    styles: IBaseStyleProps;
}
type TFormComponent = ITextInputComponent | INumberInputComponent | IEmailInputComponent | ITextareaInputComponent | ISelectInputComponent | IRadioGroupComponent | ISegmentGroupComponent | ICheckboxGroupComponent | IDateTimePickerComponent | ISignatureInputComponent | IDatePickerComponent | IHeadingComponent | IInstructionComponent | ISectionComponent | ITableComponent | IDataGridComponent | IFileComponent | ILocationComponent;

interface IAvailableComponent {
    id: string;
    label: string;
    type: string;
    key: string;
}
interface IConditionalLogic {
    action: 'show' | 'hide' | 'always';
    when: 'all' | 'any';
    conditions: ICondition[];
}
interface IConditionalEvaluationResult {
    shouldShow: boolean;
    evaluatedConditions: Array<{
        condition: ICondition;
        result: boolean;
        componentValue: any;
    }>;
}
declare class ConditionalLogicService {
    private static instance;
    private constructor();
    static getInstance(): ConditionalLogicService;
    /**
     * Get all available components in the form for conditional logic
     * @param formSchema - The current form schema containing all components
     * @param excludeComponentId - Optional component ID to exclude from the list
     * @returns Array of available components with their metadata
     */
    getAvailableComponentsForConditional(formSchema: TFormComponent[], excludeComponentId?: string): IAvailableComponent[];
    getApplicableOperators(componentType: string): string[];
    validateConditionalLogic(conditional: IConditionalLogic, formSchema: TFormComponent[]): {
        isValid: boolean;
        errors: string[];
    };
    /**
     * Evaluate whether a component should be shown based on conditional logic
     * @param conditional - The conditional logic to evaluate
     * @param formSchema - The current form schema
     * @param formValues - Current form values (component values)
     * @returns Evaluation result with details
     */
    evaluateConditionalLogic(conditional: IConditionalLogic, formSchema: TFormComponent[], formValues: Record<string, any>): IConditionalEvaluationResult;
    /**
     * Get the current value of a component
     * @param componentId - The component ID to get value for
     * @param formSchema - The current form schema
     * @param formValues - Current form values
     * @returns The component value or undefined if not found
     */
    private getComponentValue;
    /**
     * Evaluate a single condition
     * @param condition - The condition to evaluate
     * @param componentValue - The current value of the component
     * @returns Boolean result of the condition evaluation
     */
    private evaluateCondition;
    /**
     * Evaluate checkbox-specific conditions (checked/notChecked)
     * @param componentValue - The current value of the checkbox component
     * @param expectedValue - Either 'checked' or 'notChecked'
     * @returns Boolean result of the checkbox condition evaluation
     */
    private evaluateCheckboxCondition;
    /**
     * Determine if a checkbox component is checked based on its value
     * @param componentValue - The current value of the checkbox component
     * @returns Boolean indicating if checkbox is checked
     */
    private isCheckboxChecked;
    /**
     * Determine final result based on 'when' condition (all/any) and action (show/hide)
     * @param conditional - The conditional logic configuration
     * @param evaluatedConditions - Array of evaluated conditions
     * @returns Final boolean result
     */
    private determineFinalResult;
    private isEqual;
    private isEmpty;
    private contains;
    private isGreaterThan;
    private isLessThan;
    private isGreaterThanOrEqual;
    private isLessThanOrEqual;
    private isValidConditionValue;
    createDefaultConditionalLogic(): IConditionalLogic;
    getOperatorDisplayText(operator: string): string;
    getActionDisplayText(action: string): string;
    getConditionalLogicSummary(conditional: IConditionalLogic, formSchema: TFormComponent[]): string;
    private formatConditionValue;
}
declare const conditionalLogicService: ConditionalLogicService;

interface IFieldConfig {
    key: string;
    label: string;
    type: 'text' | 'number' | 'boolean' | 'select' | 'checkbox' | 'radio' | 'date' | 'date-time' | 'email' | 'textarea' | 'range' | 'signature' | 'options' | 'dynamic-columns';
    defaultValue?: string | number | string[] | boolean;
    placeholder?: string;
    options?: {
        label: string;
        value: string;
    }[];
    validation?: {
        required?: boolean;
        minLength?: number;
        maxLength?: number;
        pattern?: string;
        readonly?: boolean;
        message?: string;
        minCheckedNumber?: number;
        maxCheckedNumber?: number;
        minDate?: string;
        maxDate?: string;
    };
    min?: number;
    max?: number;
    step?: number;
    description?: string;
    helpText?: string;
}
interface ITabConfig {
    id: string;
    label: string;
    fields: IFieldConfig[];
    description?: string;
}
interface IComponentConfig {
    type: string;
    tabs: ITabConfig[];
    category?: 'Basic' | 'Advanced' | 'Layout' | 'Custom';
    description?: string;
}
declare const READONLY_FIELD: IFieldConfig;
declare const REQUIRED_FIELD: IFieldConfig;
declare const LABEL_ALIGNMENT_FIELD: IFieldConfig;
declare const CUSTOM_VALIDATION_MESSAGE_FIELD: IFieldConfig;
declare const LABEL_FIELD: IFieldConfig;
declare const PLACEHOLDER_FIELD: IFieldConfig;
declare const DEFAULT_VALUE_FIELD: IFieldConfig;
declare const DESCRIPTION_FIELD: IFieldConfig;
declare const HELP_TEXT_FIELD: IFieldConfig;
declare const COMMENTS_FIELD: IFieldConfig;
declare const INLINE_LAYOUT_FIELD: IFieldConfig;
declare const ROWS_FIELD: IFieldConfig;
declare const DECIMAL_PLACES_FIELD: IFieldConfig;
declare const INTEGER_ONLY_FIELD: IFieldConfig;
declare const MIN_CHECKED_NUMBER_FIELD: IFieldConfig;
declare const MAX_CHECKED_NUMBER_FIELD: IFieldConfig;
declare const TIME_FORMAT_FIELD: IFieldConfig;
declare const HEIGHT_FIELD: IFieldConfig;
declare const PEN_COLOR_FIELD: IFieldConfig;
declare const BACKGROUND_COLOR_FIELD: IFieldConfig;

export { BACKGROUND_COLOR_FIELD, COMMENTS_FIELD, CUSTOM_VALIDATION_MESSAGE_FIELD, ConditionalLogicService, DECIMAL_PLACES_FIELD, DEFAULT_VALUE_FIELD, DESCRIPTION_FIELD, DfFormCheckbox, DfFormDataGrid, DfFormDateTime, DfFormFileUpload, DfFormHeading, DfFormInput, DfFormInstruction, DfFormLocation, DfFormPreview, DfFormRadio, DfFormSection, DfFormSegment, DfFormSelect, DfFormSignature, DfFormTextarea, HEIGHT_FIELD, HELP_TEXT_FIELD, INLINE_LAYOUT_FIELD, INTEGER_ONLY_FIELD, LABEL_ALIGNMENT_FIELD, LABEL_FIELD, MAX_CHECKED_NUMBER_FIELD, MIN_CHECKED_NUMBER_FIELD, PEN_COLOR_FIELD, PLACEHOLDER_FIELD, READONLY_FIELD, REQUIRED_FIELD, ROWS_FIELD, TIME_FORMAT_FIELD, conditionalLogicService };
export type { DataGridEntry, DeviceType, DfFormPreviewProps, ErrorMessageProps, FormComponentProps, FormComponentType, IAvailableComponent, IBaseFormComponent, ICheckboxComponent, IComponentConfig, IConditionalEvaluationResult, IConditionalLogic, IDataGridComponent$1 as IDataGridComponent, IDateComponent, IDividerComponent, IEmailInputComponent$1 as IEmailInputComponent, IFieldConfig, IFileComponent$1 as IFileComponent, IFormControlChange, IFormValidationErrors, IHeadingComponent$1 as IHeadingComponent, INumberInputComponent$1 as INumberInputComponent, IRadioComponent, ISectionComponent$1 as ISectionComponent, ISelectComponent, ISignatureComponent, ITabConfig, ITableComponent$1 as ITableComponent, ITextInputComponent$1 as ITextInputComponent, ITextareaComponent, TInputComponentType$1 as TInputComponentType, TableCell, ValidationResult, ValidationRule };