@dmitryvim/form-builder 0.1.22 → 0.1.25

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/docs/schema.md CHANGED
@@ -6,9 +6,9 @@ Complete reference for Form Builder JSON Schema v0.3 format.
6
6
 
7
7
  ```typescript
8
8
  interface FormSchema {
9
- version: "0.3"; // Required: Schema version
10
- title: string; // Form title
11
- elements: FormElement[]; // Array of form elements
9
+ version: "0.3"; // Required: Schema version
10
+ title: string; // Form title
11
+ elements: FormElement[]; // Array of form elements
12
12
  }
13
13
  ```
14
14
 
@@ -32,8 +32,9 @@ Single line text input with validation.
32
32
  ```
33
33
 
34
34
  **Properties:**
35
+
35
36
  - `minLength` - Minimum character count
36
- - `maxLength` - Maximum character count
37
+ - `maxLength` - Maximum character count
37
38
  - `pattern` - Regular expression for validation
38
39
  - `default` - Default value
39
40
 
@@ -44,7 +45,7 @@ Multi-line text input.
44
45
  ```json
45
46
  {
46
47
  "type": "textarea",
47
- "key": "description",
48
+ "key": "description",
48
49
  "label": "Description",
49
50
  "required": false,
50
51
  "minLength": 0,
@@ -74,6 +75,7 @@ Numeric input with constraints.
74
75
  ```
75
76
 
76
77
  **Properties:**
78
+
77
79
  - `min` - Minimum value
78
80
  - `max` - Maximum value
79
81
  - `decimals` - Number of decimal places (0-8)
@@ -99,6 +101,7 @@ Dropdown selection with predefined options.
99
101
  ```
100
102
 
101
103
  **Properties:**
104
+
102
105
  - `options` - Array of value/label pairs
103
106
 
104
107
  ### File Field
@@ -120,6 +123,7 @@ Single file upload with preview.
120
123
  ```
121
124
 
122
125
  **Properties:**
126
+
123
127
  - `accept.extensions` - Allowed file extensions
124
128
  - `accept.mime` - Allowed MIME types
125
129
  - `maxSizeMB` - Maximum file size in megabytes
@@ -145,6 +149,7 @@ Multiple file upload with count limits.
145
149
  ```
146
150
 
147
151
  **Properties:**
152
+
148
153
  - `minCount` - Minimum number of files
149
154
  - `maxCount` - Maximum number of files
150
155
  - All `file` type properties
@@ -166,7 +171,7 @@ Nested object structure with optional repetition.
166
171
  "required": true
167
172
  },
168
173
  {
169
- "type": "text",
174
+ "type": "text",
170
175
  "key": "city",
171
176
  "label": "City",
172
177
  "required": true
@@ -176,6 +181,7 @@ Nested object structure with optional repetition.
176
181
  ```
177
182
 
178
183
  **With Repetition and Custom Element Titles:**
184
+
179
185
  ```json
180
186
  {
181
187
  "type": "group",
@@ -195,7 +201,7 @@ Nested object structure with optional repetition.
195
201
  },
196
202
  {
197
203
  "type": "text",
198
- "key": "title",
204
+ "key": "title",
199
205
  "label": "Slide Title",
200
206
  "required": true
201
207
  }
@@ -204,6 +210,7 @@ Nested object structure with optional repetition.
204
210
  ```
205
211
 
206
212
  **Properties:**
213
+
207
214
  - `elements` - Array of nested form elements
208
215
  - `element_label` - Optional custom title for each group item (supports `$index` placeholder)
209
216
  - `repeat.min` - Minimum number of repetitions
@@ -215,11 +222,11 @@ All field types support these properties:
215
222
 
216
223
  ```typescript
217
224
  interface BaseElement {
218
- type: string; // Field type
219
- key: string; // Unique identifier
220
- label: string; // Display label
221
- required?: boolean; // Required validation (default: false)
222
- default?: any; // Default value (not allowed for file types)
225
+ type: string; // Field type
226
+ key: string; // Unique identifier
227
+ label: string; // Display label
228
+ required?: boolean; // Required validation (default: false)
229
+ default?: any; // Default value (not allowed for file types)
223
230
  }
224
231
  ```
225
232
 
@@ -246,7 +253,7 @@ Based on the sample from `docs/13_form_builder.html`:
246
253
  {
247
254
  "type": "files",
248
255
  "key": "assets",
249
- "label": "Additional images",
256
+ "label": "Additional images",
250
257
  "required": false,
251
258
  "accept": {
252
259
  "extensions": ["png", "jpg"],
@@ -337,10 +344,7 @@ Form submission produces structured JSON data:
337
344
  ```json
338
345
  {
339
346
  "cover": "res_abc123def456",
340
- "assets": [
341
- "res_def456ghi789",
342
- "res_ghi789jkl012"
343
- ],
347
+ "assets": ["res_def456ghi789", "res_ghi789jkl012"],
344
348
  "title": "My Amazing Project",
345
349
  "description": "A detailed description of the project...",
346
350
  "theme": "dark",
@@ -351,7 +355,7 @@ Form submission produces structured JSON data:
351
355
  "body": "Welcome to our presentation..."
352
356
  },
353
357
  {
354
- "title": "Features",
358
+ "title": "Features",
355
359
  "body": "Here are the key features..."
356
360
  }
357
361
  ]
@@ -359,6 +363,7 @@ Form submission produces structured JSON data:
359
363
  ```
360
364
 
361
365
  **Key Points:**
366
+
362
367
  - File fields return resource IDs (e.g., `res_abc123def456`)
363
368
  - Files fields return arrays of resource IDs
364
369
  - Group fields return objects or arrays of objects
@@ -393,19 +398,19 @@ During form interaction:
393
398
  For advanced validation, handle the `formSubmit` event:
394
399
 
395
400
  ```javascript
396
- window.addEventListener('message', (event) => {
397
- if (event.data.type === 'formSubmit') {
398
- const { data, schema } = event.data;
399
-
400
- // Custom validation logic
401
- if (data.email && !isValidEmail(data.email)) {
402
- // Handle validation error
403
- return;
404
- }
405
-
406
- // Process valid submission
407
- handleFormSubmission(data);
401
+ window.addEventListener("message", (event) => {
402
+ if (event.data.type === "formSubmit") {
403
+ const { data, schema } = event.data;
404
+
405
+ // Custom validation logic
406
+ if (data.email && !isValidEmail(data.email)) {
407
+ // Handle validation error
408
+ return;
408
409
  }
410
+
411
+ // Process valid submission
412
+ handleFormSubmission(data);
413
+ }
409
414
  });
410
415
  ```
411
416
 
@@ -419,9 +424,10 @@ window.addEventListener('message', (event) => {
419
424
  ### Migration Guidelines
420
425
 
421
426
  When updating schemas:
427
+
422
428
  1. Always specify the correct version
423
429
  2. Test with the form builder before deployment
424
430
  3. Use schema validation to catch errors early
425
431
  4. Provide migration paths for breaking changes
426
432
 
427
- This schema reference provides complete documentation for creating effective forms with the Form Builder library.
433
+ This schema reference provides complete documentation for creating effective forms with the Form Builder library.
package/package.json CHANGED
@@ -3,9 +3,19 @@
3
3
  "publishConfig": {
4
4
  "access": "public"
5
5
  },
6
- "version": "0.1.22",
6
+ "version": "0.1.25",
7
7
  "description": "A reusable JSON schema form builder library",
8
8
  "main": "dist/form-builder.js",
9
+ "module": "dist/form-builder.js",
10
+ "type": "module",
11
+ "exports": {
12
+ ".": {
13
+ "import": "./dist/form-builder.js",
14
+ "require": "./dist/form-builder.js",
15
+ "default": "./dist/form-builder.js"
16
+ },
17
+ "./dist/form-builder.js": "./dist/form-builder.js"
18
+ },
9
19
  "files": [
10
20
  "dist",
11
21
  "docs"
@@ -14,7 +24,9 @@
14
24
  "build": "mkdir -p dist && cp public/index.html dist/index.html && cp src/form-builder.js dist/form-builder.js && cp public/demo.js dist/demo.js && cp -r public/images dist/",
15
25
  "dev": "npm run build && serve dist --single",
16
26
  "test": "jest",
17
- "format": "prettier --write ."
27
+ "format": "prettier --write .",
28
+ "prepare": "npm run build",
29
+ "prepublishOnly": "npm run test && npm run build"
18
30
  },
19
31
  "keywords": [
20
32
  "form",