form-builder-pro 0.0.4 → 0.0.6

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.
Files changed (9) hide show
  1. package/dist/index.css +147 -52
  2. package/dist/index.css.map +1 -1
  3. package/dist/index.d.mts +58 -6
  4. package/dist/index.d.ts +58 -6
  5. package/dist/index.js +771 -31989
  6. package/dist/index.js.map +1 -1
  7. package/dist/index.mjs +769 -31990
  8. package/dist/index.mjs.map +1 -1
  9. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -2,11 +2,18 @@ import { z } from 'zod';
2
2
  import * as zustand_vanilla from 'zustand/vanilla';
3
3
 
4
4
  type FieldType = 'text' | 'textarea' | 'number' | 'date' | 'select' | 'checkbox' | 'radio' | 'toggle' | 'file' | 'email' | 'phone';
5
- type FieldWidth = '25%' | '50%' | '100%';
5
+ type FieldWidth = '25%' | '33%' | '50%' | '66%' | '75%' | '100%';
6
6
  interface ValidationRule {
7
7
  type: 'required' | 'min' | 'max' | 'minLength' | 'maxLength' | 'pattern' | 'email';
8
8
  value?: string | number | boolean;
9
9
  message?: string;
10
+ regex?: string;
11
+ }
12
+ interface AsyncOptionSource {
13
+ api: string;
14
+ method: 'GET' | 'POST';
15
+ labelKey: string;
16
+ valueKey: string;
10
17
  }
11
18
  interface FormField {
12
19
  id: string;
@@ -20,15 +27,21 @@ interface FormField {
20
27
  label: string;
21
28
  value: string;
22
29
  }[];
30
+ optionsSource?: AsyncOptionSource;
23
31
  validation?: ValidationRule[];
24
32
  width: FieldWidth;
25
33
  hidden?: boolean;
34
+ position?: {
35
+ row: number;
36
+ column: number;
37
+ };
26
38
  }
27
39
  interface FormSection {
28
40
  id: string;
29
41
  title: string;
30
42
  fields: FormField[];
31
43
  isExpanded?: boolean;
44
+ columns?: 1 | 2 | 3;
32
45
  }
33
46
  interface FormSchema {
34
47
  id: string;
@@ -73,18 +86,33 @@ declare const FormSchemaValidation: z.ZodObject<{
73
86
  }[];
74
87
  }>;
75
88
 
89
+ interface FormBuilderOptions {
90
+ existingForms?: FormSchema[];
91
+ reusableSections?: FormSection[];
92
+ mode?: 'create' | 'edit';
93
+ formJson?: FormSchema;
94
+ onSave?: (schema: FormSchema) => void;
95
+ onClone?: (schema: FormSchema) => void;
96
+ onSectionImported?: (section: FormSection) => void;
97
+ onTemplateSave?: (template: FormSection) => void;
98
+ }
76
99
  declare class FormBuilder {
77
100
  private container;
78
101
  private unsubscribe;
79
- private onSave?;
80
- constructor(container: HTMLElement, options?: {
81
- onSave?: (schema: any) => void;
82
- });
102
+ private options;
103
+ constructor(container: HTMLElement, options?: FormBuilderOptions);
104
+ loadForm(json: FormSchema): void;
105
+ cloneForm(json: FormSchema): void;
106
+ importSection(section: FormSection): void;
107
+ saveSectionAsTemplate(section: FormSection): void;
108
+ applyTemplate(template: FormSection): void;
83
109
  private setupSubscriptions;
84
110
  destroy(): void;
85
111
  private render;
86
112
  private renderToolbar;
113
+ private activeTab;
87
114
  private renderToolbox;
115
+ private renderImportList;
88
116
  private renderCanvas;
89
117
  private renderConfigPanel;
90
118
  private initSortable;
@@ -106,10 +134,17 @@ interface FormState {
106
134
  history: FormSchema[];
107
135
  historyIndex: number;
108
136
  isPreviewMode: boolean;
137
+ existingForms: FormSchema[];
138
+ templates: FormSection[];
109
139
  }
110
140
  interface FormActions {
111
141
  setSchema: (schema: FormSchema) => void;
112
142
  togglePreview: () => void;
143
+ setExistingForms: (forms: FormSchema[]) => void;
144
+ setTemplates: (templates: FormSection[]) => void;
145
+ loadForm: (formId: string) => void;
146
+ cloneExistingForm: (formId: string) => void;
147
+ importSection: (section: FormSection) => void;
113
148
  addSection: () => void;
114
149
  removeSection: (sectionId: string) => void;
115
150
  updateSection: (sectionId: string, updates: Partial<FormSection>) => void;
@@ -126,4 +161,21 @@ interface FormActions {
126
161
  }
127
162
  declare const formStore: zustand_vanilla.StoreApi<FormState & FormActions>;
128
163
 
129
- export { FieldType, FieldWidth, FormBuilder, FormField, FormRenderer, FormSchema, FormSchemaValidation, FormSection, ValidationRule, formStore };
164
+ /**
165
+ * Transforms Form Builder JSON to Platform JSON
166
+ * @param builderSchema
167
+ * @returns
168
+ */
169
+ declare const builderToPlatform: (builderSchema: FormSchema) => any;
170
+ /**
171
+ * Transforms Platform JSON to Form Builder JSON
172
+ * @param platformSchema
173
+ * @returns
174
+ */
175
+ declare const platformToBuilder: (platformSchema: any) => FormSchema;
176
+
177
+ declare const initFormBuilder: (options: FormBuilderOptions & {
178
+ containerId: string;
179
+ }) => FormBuilder;
180
+
181
+ export { AsyncOptionSource, FieldType, FieldWidth, FormBuilder, FormBuilderOptions, FormField, FormRenderer, FormSchema, FormSchemaValidation, FormSection, ValidationRule, builderToPlatform, formStore, initFormBuilder, platformToBuilder };
package/dist/index.d.ts CHANGED
@@ -2,11 +2,18 @@ import { z } from 'zod';
2
2
  import * as zustand_vanilla from 'zustand/vanilla';
3
3
 
4
4
  type FieldType = 'text' | 'textarea' | 'number' | 'date' | 'select' | 'checkbox' | 'radio' | 'toggle' | 'file' | 'email' | 'phone';
5
- type FieldWidth = '25%' | '50%' | '100%';
5
+ type FieldWidth = '25%' | '33%' | '50%' | '66%' | '75%' | '100%';
6
6
  interface ValidationRule {
7
7
  type: 'required' | 'min' | 'max' | 'minLength' | 'maxLength' | 'pattern' | 'email';
8
8
  value?: string | number | boolean;
9
9
  message?: string;
10
+ regex?: string;
11
+ }
12
+ interface AsyncOptionSource {
13
+ api: string;
14
+ method: 'GET' | 'POST';
15
+ labelKey: string;
16
+ valueKey: string;
10
17
  }
11
18
  interface FormField {
12
19
  id: string;
@@ -20,15 +27,21 @@ interface FormField {
20
27
  label: string;
21
28
  value: string;
22
29
  }[];
30
+ optionsSource?: AsyncOptionSource;
23
31
  validation?: ValidationRule[];
24
32
  width: FieldWidth;
25
33
  hidden?: boolean;
34
+ position?: {
35
+ row: number;
36
+ column: number;
37
+ };
26
38
  }
27
39
  interface FormSection {
28
40
  id: string;
29
41
  title: string;
30
42
  fields: FormField[];
31
43
  isExpanded?: boolean;
44
+ columns?: 1 | 2 | 3;
32
45
  }
33
46
  interface FormSchema {
34
47
  id: string;
@@ -73,18 +86,33 @@ declare const FormSchemaValidation: z.ZodObject<{
73
86
  }[];
74
87
  }>;
75
88
 
89
+ interface FormBuilderOptions {
90
+ existingForms?: FormSchema[];
91
+ reusableSections?: FormSection[];
92
+ mode?: 'create' | 'edit';
93
+ formJson?: FormSchema;
94
+ onSave?: (schema: FormSchema) => void;
95
+ onClone?: (schema: FormSchema) => void;
96
+ onSectionImported?: (section: FormSection) => void;
97
+ onTemplateSave?: (template: FormSection) => void;
98
+ }
76
99
  declare class FormBuilder {
77
100
  private container;
78
101
  private unsubscribe;
79
- private onSave?;
80
- constructor(container: HTMLElement, options?: {
81
- onSave?: (schema: any) => void;
82
- });
102
+ private options;
103
+ constructor(container: HTMLElement, options?: FormBuilderOptions);
104
+ loadForm(json: FormSchema): void;
105
+ cloneForm(json: FormSchema): void;
106
+ importSection(section: FormSection): void;
107
+ saveSectionAsTemplate(section: FormSection): void;
108
+ applyTemplate(template: FormSection): void;
83
109
  private setupSubscriptions;
84
110
  destroy(): void;
85
111
  private render;
86
112
  private renderToolbar;
113
+ private activeTab;
87
114
  private renderToolbox;
115
+ private renderImportList;
88
116
  private renderCanvas;
89
117
  private renderConfigPanel;
90
118
  private initSortable;
@@ -106,10 +134,17 @@ interface FormState {
106
134
  history: FormSchema[];
107
135
  historyIndex: number;
108
136
  isPreviewMode: boolean;
137
+ existingForms: FormSchema[];
138
+ templates: FormSection[];
109
139
  }
110
140
  interface FormActions {
111
141
  setSchema: (schema: FormSchema) => void;
112
142
  togglePreview: () => void;
143
+ setExistingForms: (forms: FormSchema[]) => void;
144
+ setTemplates: (templates: FormSection[]) => void;
145
+ loadForm: (formId: string) => void;
146
+ cloneExistingForm: (formId: string) => void;
147
+ importSection: (section: FormSection) => void;
113
148
  addSection: () => void;
114
149
  removeSection: (sectionId: string) => void;
115
150
  updateSection: (sectionId: string, updates: Partial<FormSection>) => void;
@@ -126,4 +161,21 @@ interface FormActions {
126
161
  }
127
162
  declare const formStore: zustand_vanilla.StoreApi<FormState & FormActions>;
128
163
 
129
- export { FieldType, FieldWidth, FormBuilder, FormField, FormRenderer, FormSchema, FormSchemaValidation, FormSection, ValidationRule, formStore };
164
+ /**
165
+ * Transforms Form Builder JSON to Platform JSON
166
+ * @param builderSchema
167
+ * @returns
168
+ */
169
+ declare const builderToPlatform: (builderSchema: FormSchema) => any;
170
+ /**
171
+ * Transforms Platform JSON to Form Builder JSON
172
+ * @param platformSchema
173
+ * @returns
174
+ */
175
+ declare const platformToBuilder: (platformSchema: any) => FormSchema;
176
+
177
+ declare const initFormBuilder: (options: FormBuilderOptions & {
178
+ containerId: string;
179
+ }) => FormBuilder;
180
+
181
+ export { AsyncOptionSource, FieldType, FieldWidth, FormBuilder, FormBuilderOptions, FormField, FormRenderer, FormSchema, FormSchemaValidation, FormSection, ValidationRule, builderToPlatform, formStore, initFormBuilder, platformToBuilder };