extended-dynamic-forms 0.1.15 → 0.1.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +859 -551
- package/dist/extended-dynamic-forms.standalone.js +882 -0
- package/dist/style.css +1 -1
- package/examples/conditional-v2-example.tsx +64 -0
- package/examples/dynamic-array-items-example.tsx +211 -0
- package/examples/form-devtools-example.tsx +386 -0
- package/examples/global-ui-rules-example.tsx +356 -0
- package/examples/vanilla-js/README.md +212 -0
- package/examples/vanilla-js/basic-form.html +142 -0
- package/examples/vanilla-js/conditional-form.html +159 -0
- package/examples/vanilla-js/wizard-form.html +185 -0
- package/package.json +53 -37
- package/dist/ExtendedForm.d.ts +0 -4
- package/dist/components/arrays/ArrayFieldItemTemplate.d.ts +0 -3
- package/dist/components/arrays/ArrayFieldTemplate.d.ts +0 -3
- package/dist/components/arrays/index.d.ts +0 -2
- package/dist/components/fields/AddressField.d.ts +0 -4
- package/dist/components/fields/CurrencyField.d.ts +0 -4
- package/dist/components/fields/PhoneField.d.ts +0 -4
- package/dist/components/index.d.ts +0 -15
- package/dist/components/ui/badge.d.ts +0 -9
- package/dist/components/ui/button.d.ts +0 -11
- package/dist/components/ui/calendar.d.ts +0 -8
- package/dist/components/ui/card.d.ts +0 -8
- package/dist/components/ui/checkbox.d.ts +0 -4
- package/dist/components/ui/date-picker.d.ts +0 -13
- package/dist/components/ui/input.d.ts +0 -5
- package/dist/components/ui/label.d.ts +0 -5
- package/dist/components/ui/popover.d.ts +0 -6
- package/dist/components/ui/select.d.ts +0 -13
- package/dist/components/ui/slider.d.ts +0 -4
- package/dist/components/ui/textarea.d.ts +0 -5
- package/dist/conditionals/ConditionalForm.d.ts +0 -7
- package/dist/conditionals/index.d.ts +0 -4
- package/dist/conditionals/initialStateUtils.d.ts +0 -18
- package/dist/conditionals/types.d.ts +0 -65
- package/dist/conditionals/utils.d.ts +0 -22
- package/dist/events/FormEventContext.d.ts +0 -20
- package/dist/events/FormEventHub.d.ts +0 -27
- package/dist/events/FormEventManager.d.ts +0 -10
- package/dist/events/index.d.ts +0 -4
- package/dist/index.d.ts +0 -15
- package/dist/index.es.js +0 -15405
- package/dist/index.umd.js +0 -116
- package/dist/layouts/grid/GridLayout.d.ts +0 -11
- package/dist/layouts/horizontal/HorizontalLayout.d.ts +0 -10
- package/dist/layouts/index.d.ts +0 -3
- package/dist/layouts/vertical/VerticalLayout.d.ts +0 -9
- package/dist/lib/utils.d.ts +0 -3
- package/dist/types/index.d.ts +0 -47
- package/dist/utils/formDataUtils.d.ts +0 -22
- package/dist/utils/index.d.ts +0 -3
- package/dist/utils/schemaUtils.d.ts +0 -24
- package/dist/utils/validationUtils.d.ts +0 -26
- package/dist/vanilla-wrapper.d.ts +0 -35
- package/dist/widgets/date/DateWidget.d.ts +0 -4
- package/dist/widgets/enhanced/EnhancedWidgets.d.ts +0 -36
- package/dist/widgets/file/FileWidget.d.ts +0 -4
- package/dist/widgets/index.d.ts +0 -33
- package/dist/widgets/input/ColorWidget.d.ts +0 -4
- package/dist/widgets/input/RangeWidget.d.ts +0 -4
- package/dist/widgets/input/RatingWidget.d.ts +0 -4
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { default as React } from 'react';
|
|
2
|
-
|
|
3
|
-
interface GridLayoutProps {
|
|
4
|
-
children: React.ReactNode;
|
|
5
|
-
columns?: number | 'auto-fit' | 'auto-fill';
|
|
6
|
-
gap?: 'small' | 'medium' | 'large';
|
|
7
|
-
minItemWidth?: string;
|
|
8
|
-
className?: string;
|
|
9
|
-
}
|
|
10
|
-
export declare const GridLayout: React.FC<GridLayoutProps>;
|
|
11
|
-
export {};
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { default as React } from 'react';
|
|
2
|
-
|
|
3
|
-
interface HorizontalLayoutProps {
|
|
4
|
-
children: React.ReactNode;
|
|
5
|
-
spacing?: 'small' | 'medium' | 'large';
|
|
6
|
-
align?: 'start' | 'center' | 'end' | 'stretch';
|
|
7
|
-
className?: string;
|
|
8
|
-
}
|
|
9
|
-
export declare const HorizontalLayout: React.FC<HorizontalLayoutProps>;
|
|
10
|
-
export {};
|
package/dist/layouts/index.d.ts
DELETED
package/dist/lib/utils.d.ts
DELETED
package/dist/types/index.d.ts
DELETED
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
import { FormProps } from '@rjsf/core';
|
|
2
|
-
import { RJSFSchema, UiSchema } from '@rjsf/utils';
|
|
3
|
-
|
|
4
|
-
export interface FormEventHandlers {
|
|
5
|
-
beforeSubmit?: (data: any) => Promise<any> | any;
|
|
6
|
-
afterSubmit?: (data: any) => Promise<void> | void;
|
|
7
|
-
beforeValidation?: (data: any) => Promise<any> | any;
|
|
8
|
-
afterValidation?: (data: any, errors: any) => Promise<void> | void;
|
|
9
|
-
}
|
|
10
|
-
export interface FormFieldEvent {
|
|
11
|
-
eventType: 'focus' | 'blur' | 'change';
|
|
12
|
-
fieldId: string;
|
|
13
|
-
fieldValue: any;
|
|
14
|
-
schema?: any;
|
|
15
|
-
formData?: any;
|
|
16
|
-
timestamp: number;
|
|
17
|
-
fieldPath?: string[];
|
|
18
|
-
}
|
|
19
|
-
export interface WebhookConfig {
|
|
20
|
-
url: string;
|
|
21
|
-
method?: 'POST' | 'PUT' | 'PATCH';
|
|
22
|
-
headers?: Record<string, string>;
|
|
23
|
-
events?: ('focus' | 'blur' | 'change')[];
|
|
24
|
-
debounceMs?: number;
|
|
25
|
-
retries?: number;
|
|
26
|
-
timeout?: number;
|
|
27
|
-
}
|
|
28
|
-
export interface FieldEventHandlers {
|
|
29
|
-
onFieldFocus?: (event: FormFieldEvent) => Promise<void> | void;
|
|
30
|
-
onFieldBlur?: (event: FormFieldEvent) => Promise<void> | void;
|
|
31
|
-
onFieldChange?: (event: FormFieldEvent) => Promise<void> | void;
|
|
32
|
-
}
|
|
33
|
-
export interface ExtendedFormProps extends Omit<FormProps, 'validator'>, FormEventHandlers, FieldEventHandlers {
|
|
34
|
-
schema: RJSFSchema;
|
|
35
|
-
uiSchema?: UiSchema;
|
|
36
|
-
webhooks?: WebhookConfig[];
|
|
37
|
-
}
|
|
38
|
-
export interface CustomWidgetProps {
|
|
39
|
-
label?: string;
|
|
40
|
-
required?: boolean;
|
|
41
|
-
disabled?: boolean;
|
|
42
|
-
readonly?: boolean;
|
|
43
|
-
autofocus?: boolean;
|
|
44
|
-
placeholder?: string;
|
|
45
|
-
help?: string;
|
|
46
|
-
rawErrors?: string[];
|
|
47
|
-
}
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
export declare const formDataUtils: {
|
|
2
|
-
/**
|
|
3
|
-
* Deep clone form data to avoid mutations
|
|
4
|
-
*/
|
|
5
|
-
cloneFormData: (data: any) => any;
|
|
6
|
-
/**
|
|
7
|
-
* Merge two form data objects
|
|
8
|
-
*/
|
|
9
|
-
mergeFormData: (current: any, updates: any) => any;
|
|
10
|
-
/**
|
|
11
|
-
* Get nested value from form data using dot notation
|
|
12
|
-
*/
|
|
13
|
-
getNestedValue: (data: any, path: string) => any;
|
|
14
|
-
/**
|
|
15
|
-
* Set nested value in form data using dot notation
|
|
16
|
-
*/
|
|
17
|
-
setNestedValue: (data: any, path: string, value: any) => any;
|
|
18
|
-
/**
|
|
19
|
-
* Remove empty values from form data
|
|
20
|
-
*/
|
|
21
|
-
removeEmptyValues: (data: any) => any;
|
|
22
|
-
};
|
package/dist/utils/index.d.ts
DELETED
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import { RJSFSchema } from '@rjsf/utils';
|
|
2
|
-
|
|
3
|
-
export declare const schemaUtils: {
|
|
4
|
-
/**
|
|
5
|
-
* Get required fields from schema
|
|
6
|
-
*/
|
|
7
|
-
getRequiredFields: (schema: RJSFSchema) => string[];
|
|
8
|
-
/**
|
|
9
|
-
* Check if a field is required
|
|
10
|
-
*/
|
|
11
|
-
isFieldRequired: (schema: RJSFSchema, fieldName: string) => boolean;
|
|
12
|
-
/**
|
|
13
|
-
* Get field schema by path
|
|
14
|
-
*/
|
|
15
|
-
getFieldSchema: (schema: RJSFSchema, path: string) => RJSFSchema | undefined;
|
|
16
|
-
/**
|
|
17
|
-
* Merge two schemas
|
|
18
|
-
*/
|
|
19
|
-
mergeSchemas: (schema1: RJSFSchema, schema2: RJSFSchema) => RJSFSchema;
|
|
20
|
-
/**
|
|
21
|
-
* Get all field paths from schema
|
|
22
|
-
*/
|
|
23
|
-
getAllFieldPaths: (schema: RJSFSchema, prefix?: string) => string[];
|
|
24
|
-
};
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
export declare const validationUtils: {
|
|
2
|
-
/**
|
|
3
|
-
* Validate email format
|
|
4
|
-
*/
|
|
5
|
-
isValidEmail: (email: string) => boolean;
|
|
6
|
-
/**
|
|
7
|
-
* Validate phone number format
|
|
8
|
-
*/
|
|
9
|
-
isValidPhone: (phone: string) => boolean;
|
|
10
|
-
/**
|
|
11
|
-
* Validate URL format
|
|
12
|
-
*/
|
|
13
|
-
isValidUrl: (url: string) => boolean;
|
|
14
|
-
/**
|
|
15
|
-
* Validate date format
|
|
16
|
-
*/
|
|
17
|
-
isValidDate: (date: string) => boolean;
|
|
18
|
-
/**
|
|
19
|
-
* Validate number in range
|
|
20
|
-
*/
|
|
21
|
-
isInRange: (value: number, min?: number, max?: number) => boolean;
|
|
22
|
-
/**
|
|
23
|
-
* Custom validation messages
|
|
24
|
-
*/
|
|
25
|
-
getValidationMessage: (type: string, params?: any) => string;
|
|
26
|
-
};
|
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
import { ExtendedFormProps } from './types';
|
|
2
|
-
import { ConditionalFormProps } from './conditionals/types';
|
|
3
|
-
|
|
4
|
-
export interface VanillaFormInstance {
|
|
5
|
-
update: (props: Partial<ExtendedFormProps>) => void;
|
|
6
|
-
destroy: () => void;
|
|
7
|
-
getFormData: () => any;
|
|
8
|
-
submit: () => void;
|
|
9
|
-
reset: () => void;
|
|
10
|
-
}
|
|
11
|
-
export interface VanillaFormOptions extends ExtendedFormProps {
|
|
12
|
-
container: string | HTMLElement;
|
|
13
|
-
conditionalRules?: ConditionalFormProps['conditionalRules'];
|
|
14
|
-
}
|
|
15
|
-
export declare const ExtendedDynamicForms: {
|
|
16
|
-
/**
|
|
17
|
-
* Create a new form instance
|
|
18
|
-
* @param options - All ExtendedForm props plus container specification
|
|
19
|
-
* @returns VanillaFormInstance for controlling the form
|
|
20
|
-
*/
|
|
21
|
-
createForm: (options: VanillaFormOptions) => VanillaFormInstance;
|
|
22
|
-
/**
|
|
23
|
-
* Helper to check if the library is loaded
|
|
24
|
-
*/
|
|
25
|
-
isLoaded: () => boolean;
|
|
26
|
-
/**
|
|
27
|
-
* Get library version
|
|
28
|
-
*/
|
|
29
|
-
version: string;
|
|
30
|
-
};
|
|
31
|
-
declare global {
|
|
32
|
-
interface Window {
|
|
33
|
-
ExtendedDynamicForms: typeof ExtendedDynamicForms;
|
|
34
|
-
}
|
|
35
|
-
}
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
import { WidgetProps } from '@rjsf/utils';
|
|
2
|
-
|
|
3
|
-
export declare function EnhancedTextWidget(props: WidgetProps): import("react/jsx-runtime").JSX.Element;
|
|
4
|
-
export declare function EnhancedTextareaWidget(props: WidgetProps): import("react/jsx-runtime").JSX.Element;
|
|
5
|
-
export declare function EnhancedSelectWidget(props: WidgetProps): import("react/jsx-runtime").JSX.Element;
|
|
6
|
-
export declare function EnhancedCheckboxWidget(props: WidgetProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
-
export declare function EnhancedRadioWidget(props: WidgetProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
-
export declare function EnhancedNumberWidget(props: WidgetProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
-
export declare function TelephoneWidget(props: WidgetProps): import("react/jsx-runtime").JSX.Element;
|
|
10
|
-
export declare function EmailWidget(props: WidgetProps): import("react/jsx-runtime").JSX.Element;
|
|
11
|
-
export declare function URLWidget(props: WidgetProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
-
export declare function PasswordWidget(props: WidgetProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
-
export declare function DateWidget(props: WidgetProps): import("react/jsx-runtime").JSX.Element;
|
|
14
|
-
export declare function DateTimeWidget(props: WidgetProps): import("react/jsx-runtime").JSX.Element;
|
|
15
|
-
export declare function FileUploadWidget(props: WidgetProps): import("react/jsx-runtime").JSX.Element;
|
|
16
|
-
export declare const customWidgets: {
|
|
17
|
-
TextWidget: typeof EnhancedTextWidget;
|
|
18
|
-
TextareaWidget: typeof EnhancedTextareaWidget;
|
|
19
|
-
SelectWidget: typeof EnhancedSelectWidget;
|
|
20
|
-
CheckboxWidget: typeof EnhancedCheckboxWidget;
|
|
21
|
-
RadioWidget: typeof EnhancedRadioWidget;
|
|
22
|
-
UpDownWidget: typeof EnhancedNumberWidget;
|
|
23
|
-
FileWidget: typeof FileUploadWidget;
|
|
24
|
-
tel: typeof TelephoneWidget;
|
|
25
|
-
email: typeof EmailWidget;
|
|
26
|
-
url: typeof URLWidget;
|
|
27
|
-
password: typeof PasswordWidget;
|
|
28
|
-
date: typeof DateWidget;
|
|
29
|
-
'datetime-local': typeof DateTimeWidget;
|
|
30
|
-
TelWidget: typeof TelephoneWidget;
|
|
31
|
-
EmailWidget: typeof EmailWidget;
|
|
32
|
-
URLWidget: typeof URLWidget;
|
|
33
|
-
PasswordWidget: typeof PasswordWidget;
|
|
34
|
-
DateWidget: typeof DateWidget;
|
|
35
|
-
DateTimeWidget: typeof DateTimeWidget;
|
|
36
|
-
};
|
package/dist/widgets/index.d.ts
DELETED
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
import { ColorWidget } from './input/ColorWidget';
|
|
2
|
-
import { DateWidget } from './date/DateWidget';
|
|
3
|
-
import { FileWidget } from './file/FileWidget';
|
|
4
|
-
import { RangeWidget } from './input/RangeWidget';
|
|
5
|
-
import { RatingWidget } from './input/RatingWidget';
|
|
6
|
-
import { customWidgets as enhancedWidgets, EnhancedTextWidget, EnhancedTextareaWidget, EnhancedSelectWidget, EnhancedCheckboxWidget, EnhancedRadioWidget, EnhancedNumberWidget, TelephoneWidget, EmailWidget, URLWidget, PasswordWidget, DateTimeWidget, FileUploadWidget } from './enhanced/EnhancedWidgets';
|
|
7
|
-
|
|
8
|
-
export declare const customWidgets: {
|
|
9
|
-
TextWidget: typeof EnhancedTextWidget;
|
|
10
|
-
TextareaWidget: typeof EnhancedTextareaWidget;
|
|
11
|
-
SelectWidget: typeof EnhancedSelectWidget;
|
|
12
|
-
CheckboxWidget: typeof EnhancedCheckboxWidget;
|
|
13
|
-
RadioWidget: typeof EnhancedRadioWidget;
|
|
14
|
-
UpDownWidget: typeof EnhancedNumberWidget;
|
|
15
|
-
FileWidget: typeof FileUploadWidget;
|
|
16
|
-
tel: typeof TelephoneWidget;
|
|
17
|
-
email: typeof EmailWidget;
|
|
18
|
-
url: typeof URLWidget;
|
|
19
|
-
password: typeof PasswordWidget;
|
|
20
|
-
date: typeof import('./enhanced/EnhancedWidgets').DateWidget;
|
|
21
|
-
'datetime-local': typeof DateTimeWidget;
|
|
22
|
-
TelWidget: typeof TelephoneWidget;
|
|
23
|
-
EmailWidget: typeof EmailWidget;
|
|
24
|
-
URLWidget: typeof URLWidget;
|
|
25
|
-
PasswordWidget: typeof PasswordWidget;
|
|
26
|
-
DateWidget: typeof import('./enhanced/EnhancedWidgets').DateWidget;
|
|
27
|
-
DateTimeWidget: typeof DateTimeWidget;
|
|
28
|
-
color: import('react').FC<import('@rjsf/utils').WidgetProps<any, import('@rjsf/utils').RJSFSchema, any>>;
|
|
29
|
-
file: import('react').FC<import('@rjsf/utils').WidgetProps<any, import('@rjsf/utils').RJSFSchema, any>>;
|
|
30
|
-
range: import('react').FC<import('@rjsf/utils').WidgetProps<any, import('@rjsf/utils').RJSFSchema, any>>;
|
|
31
|
-
rating: import('react').FC<import('@rjsf/utils').WidgetProps<any, import('@rjsf/utils').RJSFSchema, any>>;
|
|
32
|
-
};
|
|
33
|
-
export { ColorWidget, DateWidget, FileWidget, RangeWidget, RatingWidget, EnhancedTextWidget, EnhancedTextareaWidget, EnhancedSelectWidget, EnhancedCheckboxWidget, EnhancedRadioWidget, EnhancedNumberWidget, TelephoneWidget, EmailWidget, URLWidget, PasswordWidget, DateTimeWidget, FileUploadWidget, enhancedWidgets, };
|