extended-dynamic-forms/dist/widgets/base/types.d.ts

Extended React JSON Schema Form (RJSF) v6 with custom components, widgets, templates, layouts, and form events

import { WidgetProps } from '@rjsf/utils';

/**
 * Base interface for all enhanced widgets
 */
export interface EnhancedWidgetProps extends WidgetProps {
}
/**
 * Ant Design Input component options that can be configured through uiSchema
 */
export interface AntInputOptions {
    size?: 'large' | 'middle' | 'small';
    placeholder?: string;
    prefix?: React.ReactNode;
    suffix?: React.ReactNode;
    allowClear?: boolean;
    bordered?: boolean;
    variant?: 'outlined' | 'borderless' | 'filled';
    defaultValue?: string;
    maxLength?: number;
    showCount?: boolean | {
        formatter: (info: {
            value: string;
            count: number;
            maxLength?: number;
        }) => React.ReactNode;
    };
    status?: 'error' | 'warning';
    style?: React.CSSProperties;
    className?: string;
    addonBefore?: React.ReactNode;
    addonAfter?: React.ReactNode;
    emptyValue?: any;
}
/**
 * Ant Design TextArea component options
 */
export interface AntTextAreaOptions extends AntInputOptions {
    rows?: number;
    autoSize?: boolean | {
        minRows?: number;
        maxRows?: number;
    };
    showCount?: boolean | {
        formatter: (info: {
            value: string;
            count: number;
            maxLength?: number;
        }) => React.ReactNode;
    };
}
/**
 * Ant Design DatePicker component options
 */
export interface AntDatePickerOptions {
    format?: string | string[];
    picker?: 'date' | 'week' | 'month' | 'quarter' | 'year';
    placeholder?: string | [string, string];
    placement?: 'bottomLeft' | 'bottomRight' | 'topLeft' | 'topRight';
    showTime?: boolean | object;
    showNow?: boolean;
    showToday?: boolean;
    disabledDate?: (currentDate: any) => boolean;
    size?: 'large' | 'middle' | 'small';
    bordered?: boolean;
    variant?: 'outlined' | 'borderless' | 'filled';
    suffixIcon?: React.ReactNode;
    style?: React.CSSProperties;
    className?: string;
    status?: 'error' | 'warning';
    emptyValue?: any;
}
/**
 * Ant Design InputNumber component options
 */
export interface AntInputNumberOptions {
    size?: 'large' | 'middle' | 'small';
    placeholder?: string;
    prefix?: React.ReactNode;
    min?: number;
    max?: number;
    step?: number;
    precision?: number;
    decimalSeparator?: string;
    formatter?: (value: number | string | undefined, info: {
        userTyping: boolean;
        input: string;
    }) => string;
    parser?: (value: string | undefined) => number;
    keyboard?: boolean;
    controls?: boolean | {
        upIcon?: React.ReactNode;
        downIcon?: React.ReactNode;
    };
    bordered?: boolean;
    variant?: 'outlined' | 'borderless' | 'filled';
    style?: React.CSSProperties;
    className?: string;
    status?: 'error' | 'warning';
    addonBefore?: React.ReactNode;
    addonAfter?: React.ReactNode;
    emptyValue?: any;
}
/**
 * Type mapping for widget options
 */
export type WidgetOptionsMap = {
    text: AntInputOptions;
    textarea: AntTextAreaOptions;
    password: AntInputOptions;
    email: AntInputOptions;
    tel: AntInputOptions;
    url: AntInputOptions;
    number: AntInputNumberOptions;
    date: AntDatePickerOptions;
    'datetime-local': AntDatePickerOptions;
    file: any;
};
/**
 * Common props passed to widgets from RJSF that we use frequently
 */
export interface CommonWidgetProps {
    id: string;
    value: any;
    disabled?: boolean;
    readonly?: boolean;
    required?: boolean;
    placeholder?: string;
    onChange: (value: any) => void;
    onBlur?: (id: string, value: any) => void;
    onFocus?: (id: string, value: any) => void;
    options?: any;
    rawErrors?: string[];
    schema: any;
}