var jsDaisyUI = { // Function to generate a DaisyUI 5-based form as a JSON structure from a JSON schema schemaToForm: function (params) { if (!params.schema || !params.schema.properties) { return { html: [ { tag: 'p', attr: {}, text: 'schemaToForm Error: Invalid JSON schema provided.' } ] }; } const formElements = []; // Iterate through schema properties for (const [key, prop] of Object.entries(params.schema.properties)) { const label = prop.title || key; const required = params.schema.required && params.schema.required.includes(key) ? 'required' : ''; const inputId = `input-${key}`; // Unique ID for accessibility const hiddenId = (key == 'id' && jsonApp && jsonApp.json.data.settings && !jsonApp.json.data.settings.debug) ? ' hidden' : ''; // Create fieldset for each field const fieldsetChildren = [ { tag: 'label', attr: { class: 'label text-primary capitalize' + hiddenId, for: inputId }, html: [ { tag: 'span', attr: {}, text: label } ] } ]; // Handle different input types let inputElement; switch (prop.type) { case 'string': inputElement = { tag: 'input', attr: { id: inputId, type: 'text', name: key, placeholder: prop.description || ' ', class: 'w-100 input input-primary' + hiddenId, ...(required && { required: '' }) } }; break; case 'number': case 'integer': inputElement = { tag: 'input', attr: { id: inputId, type: 'number', name: key, placeholder: prop.description || ' ', class: 'w-100 input input-primary', ...(required && { required: '' }) } }; break; case 'boolean': inputElement = { tag: 'input', attr: { id: inputId, type: 'checkbox', name: key, class: 'toggle', ...(required && { required: '' }) } }; break; case 'array': inputElement = { tag: 'textarea', attr: { id: inputId, name: key, placeholder: prop.description || 'Enter values separated by commas', class: 'w-100 textarea input-primary', ...(required && { required: '' }) } }; break; case 'object': inputElement = { tag: 'textarea', attr: { id: inputId, name: key, placeholder: prop.description || 'Enter JSON object', class: 'w-100 textarea input-primary', ...(required && { required: '' }) } }; break; default: inputElement = { tag: 'input', attr: { id: inputId, type: 'text', name: key, placeholder: prop.description || ' ', class: 'w-100 input input-primary', ...(required && { required: '' }) } }; } // Add input element to fieldset fieldsetChildren.push(inputElement); // Add fieldset to form elements formElements.push({ tag: 'fieldset', attr: { class: 'fieldset text-center' }, html: fieldsetChildren }); } // Add submit button formElements.push({ tag: 'div', attr: { class: 'w-100 mt-6 text-center' }, html: [ { tag: 'button', attr: { type: 'submit', class: 'btn btn-outline btn-primary' }, text: 'Submit' } ] }); // Return the full form structure return { html: [ { tag: 'form', attr: { class: 'space-y-4' }, html: formElements } ] }; }, createForm: function (params) { let appForm = jsDaisyUI.schemaToForm(params); appForm.selector = params.selector; jsonApp.do(appForm); } }