@dmitryvim/form-builder 0.1.18 β 0.1.20
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/dist/form-builder.js +41 -19
- package/package.json +1 -1
package/dist/form-builder.js
CHANGED
|
@@ -87,51 +87,36 @@ function validateSchema(schema) {
|
|
|
87
87
|
|
|
88
88
|
// Form rendering
|
|
89
89
|
function renderForm(schema, prefill) {
|
|
90
|
-
console.log('π§ FormBuilder.renderForm called with:', { schema, prefill });
|
|
91
|
-
console.log('π§ Prefill keys:', Object.keys(prefill || {}));
|
|
92
|
-
console.log('π§ Schema element keys:', schema.elements?.map(e => e.key));
|
|
93
90
|
|
|
94
91
|
const errors = validateSchema(schema);
|
|
95
92
|
if (errors.length > 0) {
|
|
96
93
|
console.error('Schema validation errors:', errors);
|
|
97
94
|
return;
|
|
98
95
|
}
|
|
99
|
-
console.log('β
Schema validation passed');
|
|
100
96
|
|
|
101
97
|
state.schema = schema;
|
|
102
98
|
if (!state.formRoot) {
|
|
103
99
|
console.error('No form root element set. Call setFormRoot() first.');
|
|
104
100
|
return;
|
|
105
101
|
}
|
|
106
|
-
console.log('β
FormRoot is set:', state.formRoot);
|
|
107
102
|
|
|
108
103
|
clear(state.formRoot);
|
|
109
104
|
|
|
110
105
|
const formEl = document.createElement('div');
|
|
111
106
|
formEl.className = 'space-y-6';
|
|
112
107
|
|
|
113
|
-
console.log(`π§ Processing ${schema.elements.length} schema elements`);
|
|
114
108
|
schema.elements.forEach((element, index) => {
|
|
115
|
-
console.log(`π§ Rendering element ${index}:`, element);
|
|
116
109
|
const block = renderElement(element, {
|
|
117
110
|
path: '',
|
|
118
111
|
prefill: prefill || {}
|
|
119
112
|
});
|
|
120
|
-
console.log(`β
Element ${index} rendered:`, block);
|
|
121
113
|
formEl.appendChild(block);
|
|
122
114
|
});
|
|
123
115
|
|
|
124
116
|
state.formRoot.appendChild(formEl);
|
|
125
|
-
console.log(`β
Form rendered with ${schema.elements.length} elements`);
|
|
126
117
|
}
|
|
127
118
|
|
|
128
119
|
function renderElement(element, ctx) {
|
|
129
|
-
console.log(`π§ renderElement called for '${element.key}':`, {
|
|
130
|
-
elementKey: element.key,
|
|
131
|
-
prefillKeys: Object.keys(ctx.prefill || {}),
|
|
132
|
-
prefillValue: ctx.prefill?.[element.key],
|
|
133
|
-
ctx
|
|
134
|
-
});
|
|
135
120
|
|
|
136
121
|
const wrapper = document.createElement('div');
|
|
137
122
|
wrapper.className = 'mb-6';
|
|
@@ -197,21 +182,17 @@ function renderElement(element, ctx) {
|
|
|
197
182
|
|
|
198
183
|
case 'file':
|
|
199
184
|
// TODO: Extract to renderFileElement() function
|
|
200
|
-
console.log(`π§ Rendering file element '${element.key}':`, { readonly: state.config.readonly, prefill: ctx.prefill[element.key], element });
|
|
201
185
|
if (state.config.readonly) {
|
|
202
186
|
// Readonly mode: use common preview function
|
|
203
187
|
const initial = ctx.prefill[element.key] || element.default;
|
|
204
|
-
console.log(`π§ File initial value:`, initial);
|
|
205
188
|
if (initial) {
|
|
206
189
|
const filePreview = renderFilePreviewReadonly(initial);
|
|
207
190
|
wrapper.appendChild(filePreview);
|
|
208
|
-
console.log(`β
File preview rendered for '${element.key}'`);
|
|
209
191
|
} else {
|
|
210
192
|
const emptyState = document.createElement('div');
|
|
211
193
|
emptyState.className = 'aspect-video bg-gray-100 rounded-lg flex items-center justify-center text-gray-500';
|
|
212
194
|
emptyState.innerHTML = '<div class="text-center">ΠΠ΅Ρ ΡΠ°ΠΉΠ»Π°</div>';
|
|
213
195
|
wrapper.appendChild(emptyState);
|
|
214
|
-
console.log(`β No file data for '${element.key}' - showing empty state`);
|
|
215
196
|
}
|
|
216
197
|
} else {
|
|
217
198
|
// Edit mode: normal file input
|
|
@@ -233,6 +214,24 @@ function renderElement(element, ctx) {
|
|
|
233
214
|
|
|
234
215
|
const initial = ctx.prefill[element.key] || element.default;
|
|
235
216
|
if (initial) {
|
|
217
|
+
// Add prefill data to resourceIndex so renderFilePreview can use it
|
|
218
|
+
if (!state.resourceIndex.has(initial)) {
|
|
219
|
+
// Extract filename from URL/path
|
|
220
|
+
const filename = initial.split('/').pop() || 'file';
|
|
221
|
+
// Determine file type from extension
|
|
222
|
+
const extension = filename.split('.').pop()?.toLowerCase();
|
|
223
|
+
const fileType = extension && ['jpg', 'jpeg', 'png', 'gif', 'webp'].includes(extension)
|
|
224
|
+
? `image/${extension === 'jpg' ? 'jpeg' : extension}`
|
|
225
|
+
: 'application/octet-stream';
|
|
226
|
+
|
|
227
|
+
state.resourceIndex.set(initial, {
|
|
228
|
+
name: filename,
|
|
229
|
+
type: fileType,
|
|
230
|
+
size: 0,
|
|
231
|
+
file: null // No local file for prefill data
|
|
232
|
+
});
|
|
233
|
+
console.log(`π§ Added prefill file '${element.key}' to resourceIndex:`, initial);
|
|
234
|
+
}
|
|
236
235
|
renderFilePreview(fileContainer, initial, initial, '', false).catch(console.error);
|
|
237
236
|
} else {
|
|
238
237
|
fileContainer.innerHTML = `
|
|
@@ -322,6 +321,29 @@ function renderElement(element, ctx) {
|
|
|
322
321
|
|
|
323
322
|
const initialFiles = ctx.prefill[element.key] || [];
|
|
324
323
|
|
|
324
|
+
// Add prefill files to resourceIndex so renderResourcePills can use them
|
|
325
|
+
if (initialFiles.length > 0) {
|
|
326
|
+
initialFiles.forEach(resourceId => {
|
|
327
|
+
if (!state.resourceIndex.has(resourceId)) {
|
|
328
|
+
// Extract filename from URL/path
|
|
329
|
+
const filename = resourceId.split('/').pop() || 'file';
|
|
330
|
+
// Determine file type from extension
|
|
331
|
+
const extension = filename.split('.').pop()?.toLowerCase();
|
|
332
|
+
const fileType = extension && ['jpg', 'jpeg', 'png', 'gif', 'webp'].includes(extension)
|
|
333
|
+
? `image/${extension === 'jpg' ? 'jpeg' : extension}`
|
|
334
|
+
: 'application/octet-stream';
|
|
335
|
+
|
|
336
|
+
state.resourceIndex.set(resourceId, {
|
|
337
|
+
name: filename,
|
|
338
|
+
type: fileType,
|
|
339
|
+
size: 0,
|
|
340
|
+
file: null // No local file for prefill data
|
|
341
|
+
});
|
|
342
|
+
console.log(`π§ Added prefill file to resourceIndex:`, resourceId);
|
|
343
|
+
}
|
|
344
|
+
});
|
|
345
|
+
}
|
|
346
|
+
|
|
325
347
|
function updateFilesList() {
|
|
326
348
|
renderResourcePills(list, initialFiles, (ridToRemove) => {
|
|
327
349
|
const index = initialFiles.indexOf(ridToRemove);
|