- Updated ComponentPreview.vue to support custom button styles, allowing users to define background color, text color, border color, border width, border radius, and hover effects for buttons.
- Enhanced FormBuilderFieldSettingsModal.vue with new fields for customizing button appearance, including color pickers and number inputs for border properties.
- Implemented a color preview feature in the settings modal to visualize button styles based on user selections, improving usability and customization options.
- Added utility functions for generating custom button styles dynamically, ensuring consistent styling across the application.
- Added support for initializing and managing repeating groups in ComponentPreview.vue, allowing for dynamic creation of group items based on minimum item settings.
- Implemented event emission for form data updates to notify parent components, ensuring synchronization with FormKit integration.
- Enhanced FormBuilderFieldSettingsModal.vue with new configuration options for repeating tables, including minimum and maximum records, button text settings, and table behavior controls.
- Updated safeGetField.js to ensure backward compatibility by returning empty strings for undefined or null values.
- Improved workflow page to handle form data updates from ComponentPreview, maintaining data consistency across the application.
- Enhanced form store logic to initialize preview form data for repeating groups upon component addition and form loading.
- Added new iframe parameters in FormBuilderFieldSettingsModal, allowing users to configure debug mode, hide completion messages, apply themes, and set custom URL parameters for button components linked to processes.
- Updated ComponentPreview.vue to generate dynamic workflow URLs with iframe parameters based on user settings, improving the flexibility of iframe integration.
- Implemented a URL preview feature in FormBuilderFieldSettingsModal to display the generated iframe URL based on the current configuration, enhancing user experience and usability.
- Enhanced form builder interface to include new settings for iframe integration, ensuring a more comprehensive configuration for button actions.
- Introduced new settings for button components in the FormBuilderFieldSettingsModal, allowing users to configure link types (none, custom URL, process link) and corresponding URLs or process IDs.
- Added functionality to dynamically generate button links based on user selections, improving the flexibility of button actions in the form builder.
- Updated ComponentPreview.vue to conditionally render buttons as links or regular buttons based on the new configuration options.
- Enhanced the form builder interface to include fields for specifying the number of rows for textareas, improving usability and customization.
- Implemented fetching of published processes for linking, ensuring users can select from available processes when configuring button actions.
- Updated ComponentPreview.vue to improve handling of readonly states for select, checkbox, and radio components, ensuring proper styling and interaction.
- Modified button component in ComponentPreview.vue to conditionally display button text and icon based on new props for better customization.
- Enhanced FormBuilderComponents.vue by adding new properties for button configuration, including showLabel, showButtonText, buttonText, and icon.
- Introduced new form field settings in FormBuilderFieldSettingsModal.vue to allow users to customize button size, icon, and visibility options for labels and text.
- Improved overall user experience by refining placeholder visibility in builder mode and enhancing the button action script template functionality.
- Updated the ComponentPreview component to utilize a new utility function, safeGetField, for safer field value retrieval from form data, enhancing data integrity and error handling.
- Added a new "Read Only" toggle option in the FormBuilderFieldSettingsModal, allowing users to set fields as non-editable, improving form configuration flexibility.
- Refactored various field access patterns to ensure consistent handling of undefined or null values across components.
- Improved the overall user experience by ensuring that field states are accurately reflected and managed during form previews.
- Introduced comprehensive documentation for the Travel Reimbursement Workflow, detailing form components, process definitions, and business rules.
- Added new custom scripts for the Manager Approval Form and Travel Reimbursement Form to enhance dynamic behavior and validation.
- Updated the ComponentPreview component to include a new prop for field states, improving state management during previews.
- Created JSON files for the Manager Approval Form and Travel Reimbursement Form, defining their structure and validation rules.
- Implemented a new process definition for the travel workflow, outlining the steps and decision points for claim processing.
- Established global variables for managing workflow data, ensuring consistency and accessibility across the process.
- Introduced a new Form Section component for grouping related form fields, allowing for better organization and layout within forms.
- Enhanced ComponentPreview to render the Form Section component with customizable properties such as header visibility, collapsibility, and border styles.
- Updated FormBuilderComponents to include the Form Section in the available components list with default properties.
- Implemented drag-and-drop functionality for nested components within the Form Section, improving user experience in form design.
- Enhanced FormBuilderFieldSettingsModal to support configuration options for the Form Section, including visual and spacing settings.
- Improved overall styling and responsiveness of the Form Section component to align with existing UI standards.
- Updated documentation to reflect the addition of the Form Section and its configuration options.
- Introduced a new RepeatingTable component for structured data collection, allowing users to add, edit, and delete records dynamically.
- Enhanced FormBuilderComponents to include the RepeatingTable in the available components list with default properties.
- Updated FormBuilderFieldSettingsModal to support configuration options for the RepeatingTable, including button texts, record limits, and display settings.
- Implemented data management functions for updating table data and handling dynamic list items in the FormBuilder.
- Improved ComponentPreview to render the RepeatingTable component correctly in preview mode.
- Enhanced user experience with intuitive UI elements and responsive design for the new table component.
- Updated documentation to reflect the addition of the RepeatingTable and its configuration options.
- Introduced a new ConditionalLogicEngine component to manage and execute conditional logic for form fields, allowing for dynamic visibility and behavior based on user input.
- Added conditional logic properties to various form components, enabling users to define conditions for showing, hiding, enabling, or disabling fields.
- Enhanced the dynamic list component with new settings for item validation, uniqueness, and import/export functionality, improving data management capabilities.
- Updated FormBuilderFieldSettingsModal to include a visual condition builder interface for easier configuration of conditional logic.
- Improved documentation to reflect the new features and provide guidance on using conditional logic within forms.
- Removed unnecessary event propagation handling in ComponentPreview.vue for cleaner interaction.
- Adjusted FormBuilderConfiguration.vue to ensure proper min attribute placement for maxFiles input.
- Updated FormScriptEngine.vue to allow global CSS injection and added new notification helper functions for success, error, and info messages.
- Enhanced FormTemplatesModal.vue with a new CSS & JavaScript test form template, demonstrating real-time calculations and dynamic field updates.
- Improved documentation to include a comprehensive JavaScript API reference and updated user guides for better clarity on dynamic form functionalities.
- Added new fields to the JSON schema for custom scripts and CSS, enhancing form configuration capabilities.
- Updated formBuilder.js to include a method for updating preview form data, improving state management during form interactions.
- Introduced a new Switch component for toggling options within forms, enhancing user interactivity.
- Updated formkit-custom.js to include the Switch component with appropriate props.
- Enhanced formkit-theme.js to define styles for the Switch component, ensuring consistent theming.
- Added CSS styles for the Switch component to improve visual presentation and user experience.
- Updated FormBuilderCanvas and FormBuilderComponents to support the new Switch component in the form builder interface.
- Enhanced documentation to include details about the new Switch component and its usage within forms.
- Introduced a new 'Info Display' component for displaying read-only information in a key-value format, with customizable layouts and styles.
- Removed the 'Repeater' and 'Group' components from the available components list to streamline options.
- Enhanced the Form Builder configuration to support custom scripts, CSS, and event handling, allowing for more dynamic form behavior.
- Added a modal for Form Settings, enabling users to manage form properties, custom scripts, and event triggers effectively.
- Updated the database schema to accommodate new fields for custom scripts, CSS, and event configurations.
- Implemented a history management system to track actions such as adding, updating, moving, and deleting components.
- Added a new `FormBuilderHistory` component to display action history with undo/redo functionality.
- Updated the `FormBuilderCanvas` and `FormBuilderComponents` to support history tracking and improved component selection.
- Enhanced the form store to manage action history, including limits on history length and state restoration.
- Improved user experience by integrating keyboard shortcuts for undo and redo actions.
- Refactored various components to ensure proper state management and history recording during component modifications.
- Added functionality for resizing components within the Form Builder, allowing users to adjust widths dynamically.
- Introduced a method to find optimal grid placement for new components, ensuring efficient use of available space.
- Enhanced layout optimization after component addition, deletion, and reordering to maintain a clean and organized interface.
- Updated the FormBuilderConfiguration to include width settings for components, improving customization options.
- Refactored styles for grid layout and component previews to enhance visual consistency and user experience.
- Introduced `FormBuilderComponents.vue`, `FormBuilderCanvas.vue`, and `FormBuilderConfiguration.vue` for managing form elements.
- Added `ComponentPreview.vue` for rendering previews of form components.
- Implemented state management using Pinia in `stores/formBuilder.js` to handle form components and saved forms.
- Created pages for form builder interface (`index.vue`) and form management (`manage.vue`).
- Integrated toast notifications with `useToast.js` for user feedback.
- Documented the form builder structure and features in `FORM_BUILDER_DOCUMENTATION.md` and `FORM_BUILDER_TECHNICAL_APPENDIX.md`.
- Established a responsive layout and drag-and-drop functionality for a seamless user experience.
