diff --git a/admin/form-builder/assets/js/components/field-radio/template.php b/admin/form-builder/assets/js/components/field-radio/template.php
index 70d21c971..4f45cca11 100644
--- a/admin/form-builder/assets/js/components/field-radio/template.php
+++ b/admin/form-builder/assets/js/components/field-radio/template.php
@@ -15,7 +15,6 @@ class="wpuf-items-center">
class="wpuf-block text-sm/6 wpuf-font-medium wpuf-text-gray-900 !wpuf-mb-0">
*:where(.wpuf-active) {
border-top-width: 1px;
}
+.wpuf-btm-nav-xs .wpuf-btm-nav-label {
+ font-size: 0.75rem;
+ line-height: 1rem;
+}
+
+.wpuf-btm-nav-sm {
+ height: 3rem;
+}
+
.wpuf-btm-nav-sm > *:where(.wpuf-active) {
border-top-width: 2px;
}
+.wpuf-btm-nav-sm .wpuf-btm-nav-label {
+ font-size: 0.75rem;
+ line-height: 1rem;
+}
+
+.wpuf-btm-nav-md {
+ height: 4rem;
+}
+
.wpuf-btm-nav-md > *:where(.wpuf-active) {
border-top-width: 2px;
}
+.wpuf-btm-nav-md .wpuf-btm-nav-label {
+ font-size: 0.875rem;
+ line-height: 1.25rem;
+}
+
+.wpuf-btm-nav-lg {
+ height: 5rem;
+}
+
.wpuf-btm-nav-lg > *:where(.wpuf-active) {
border-top-width: 4px;
}
+.wpuf-btm-nav-lg .wpuf-btm-nav-label {
+ font-size: 1rem;
+ line-height: 1.5rem;
+}
+
.wpuf-join.wpuf-join-vertical {
flex-direction: column;
}
@@ -3960,6 +4078,10 @@ input.wpuf-tab:checked + .wpuf-tab-content,
display: inline-flex;
}
+.wpuf-table {
+ display: table;
+}
+
.wpuf-flow-root {
display: flow-root;
}
diff --git a/assets/js-templates/form-components.php b/assets/js-templates/form-components.php
index 0130dc122..06593272c 100644
--- a/assets/js-templates/form-components.php
+++ b/assets/js-templates/form-components.php
@@ -21,7 +21,7 @@
-
@@ -120,7 +120,7 @@ class="wpuf-block wpuf-text-sm wpuf-font-medium wpuf-leading-6 wpuf-text-gray-90
{{ field.label }} *
-
@@ -506,7 +506,6 @@ class="wpuf-items-center">
class="wpuf-block text-sm/6 wpuf-font-medium wpuf-text-gray-900 !wpuf-mb-0">
= maxRepeats) {
return;
@@ -626,14 +629,27 @@ public function scripts_styles() {
wpuf.reindexInstances($container, fieldName);
wpuf.updateRepeatButtons($container);
+ // Set up MutationObserver for new buttons
+ if (window.MutationObserver && typeof observer !== 'undefined') {
+ $newInstance.find('.wpuf-add-repeat, .wpuf-remove-repeat').each(function() {
+ observer.observe(this, { attributes: true, attributeFilter: ['style', 'class'] });
+ });
+ }
+
// Initialize fields in the new instance
if (typeof WPUF_Field_Initializer !== 'undefined') {
WPUF_Field_Initializer.init();
+
+ // Re-apply button visibility after field initializer runs on new instance
+ setTimeout(function() {
+ wpuf.updateRepeatButtons($container);
+ }, 100);
}
},
removeRepeatInstance: function($instance, $container) {
var fieldName = $container.data('field-name');
+ var instanceIndex = $instance.attr('data-instance');
$instance.remove();
wpuf.reindexInstances($container, fieldName);
wpuf.updateRepeatButtons($container);
@@ -642,6 +658,7 @@ public function scripts_styles() {
reindexInstances: function($container, fieldName) {
$container.find('.wpuf-repeat-instance').each(function(index) {
var $instance = $(this);
+ var oldIndex = $instance.attr('data-instance');
$instance.attr('data-instance', index);
$instance.find('[name], [id], [for]').each(function() {
@@ -671,31 +688,110 @@ public function scripts_styles() {
updateRepeatButtons: function($container) {
var $instances = $container.find('.wpuf-repeat-instance');
var count = $instances.length;
+
+
+ // Prevent rapid successive calls
+ if ($container.data('updating-buttons')) {
+ return;
+ }
+ $container.data('updating-buttons', true);
+
$instances.each(function(i) {
- var $controls = $(this).find('.wpuf-repeat-controls');
+ var $instance = $(this);
+ var $controls = $instance.find('.wpuf-repeat-controls');
var isLast = i === count - 1;
- var isOnlyOne = count === 1;
+ var isOnlyInstance = count === 1;
+
+ // Clear existing buttons first
+ $controls.empty();
- // Show add button only on the last instance
- $controls.find('.wpuf-add-repeat').toggle(isLast);
+ // Create and add buttons based on logic
+ var addButtonHtml = '';
+ var removeButtonHtml = '';
+
+ // Add button: show only on last instance
+ if (isLast) {
+ $controls.append(addButtonHtml);
+ }
- // Show remove button on all instances except when there's only one instance
- $controls.find('.wpuf-remove-repeat').toggle(!isOnlyOne);
+ // Remove button: show on all instances EXCEPT when there's only 1 instance
+ if (!isOnlyInstance) {
+ $controls.append(removeButtonHtml);
+ }
});
+
+ // Clear the flag after a short delay
+ setTimeout(function() {
+ $container.removeData('updating-buttons');
+ }, 100);
+
}
};
wpuf.init();
+
+ // Set up MutationObserver to watch for button visibility changes
+ if (window.MutationObserver) {
+ var observer = new MutationObserver(function(mutations) {
+ var shouldUpdate = false;
+ mutations.forEach(function(mutation) {
+ if (mutation.type === 'attributes' &&
+ (mutation.attributeName === 'style' || mutation.attributeName === 'class')) {
+ var $target = $(mutation.target);
+ if ($target.hasClass('wpuf-add-repeat') || $target.hasClass('wpuf-remove-repeat')) {
+ shouldUpdate = true;
+ }
+ }
+ });
+
+ if (shouldUpdate) {
+ setTimeout(function() {
+ $('.wpuf-repeat-container').each(function() {
+ var $container = $(this);
+ wpuf.updateRepeatButtons($container);
+ });
+ }, 50);
+ }
+ });
+
+ // Start observing
+ $('.wpuf-repeat-container').each(function() {
+ var $container = $(this);
+ $container.find('.wpuf-add-repeat, .wpuf-remove-repeat').each(function() {
+ observer.observe(this, { attributes: true, attributeFilter: ['style', 'class'] });
+ });
+ });
+ }
// Initialize fields after the form is rendered with a delay to ensure DOM is ready
setTimeout(function() {
+ // First, render all repeat field buttons
+ $('.wpuf-repeat-container').each(function() {
+ var $container = $(this);
+ wpuf.updateRepeatButtons($container);
+ });
+
if (typeof WPUF_Field_Initializer !== 'undefined') {
- console.log('Calling WPUF_Field_Initializer.init() from admin metabox');
WPUF_Field_Initializer.init();
- } else {
- console.log('WPUF_Field_Initializer is not defined');
+
+ // Re-apply button visibility after field initializer runs
+ setTimeout(function() {
+ $('.wpuf-repeat-container').each(function() {
+ var $container = $(this);
+ wpuf.updateRepeatButtons($container);
+ });
+ }, 100);
+
+ // Also re-apply after a longer delay to catch any async field initialization
+ setTimeout(function() {
+ $('.wpuf-repeat-container').each(function() {
+ var $container = $(this);
+ wpuf.updateRepeatButtons($container);
+ });
+ }, 1000);
}
+
}, 500);
});
diff --git a/wpuf-functions.php b/wpuf-functions.php
index 3987eaf4e..b92cb1add 100644
--- a/wpuf-functions.php
+++ b/wpuf-functions.php
@@ -1854,37 +1854,12 @@ function wpuf_get_form_fields( $form_id ) {
$field['multiple'] = '';
}
- // if old repeat field format
+ // Ensure inner_fields is a simple array (not column structure)
if ( empty( $field['inner_fields'] ) ) {
- $old_id = $field['id'];
- $old_meta = $field['name'];
- $old_label = $field['label'];
- $new_id = wpuf_form_field_id_generator();
- $field['template'] = 'text_field';
-
- // set the new compatible values
- $field['id'] = $new_id;
- $field['name'] = $old_meta . '_' . $new_id;
- $field['label'] = '';
- $field['inner_fields']['column-1'] = [ $field ];
- $field['inner_fields']['column-2'] = [];
- $field['inner_fields']['column-3'] = [];
- $field['template'] = 'repeat_field';
- $field['columns'] = 1;
- $field['min_column'] = 1;
- $field['max_column'] = 3;
- $field['column_space'] = 5;
-
- $field['id'] = $old_id;
- $field['label'] = $old_label;
- $field['name'] = $old_meta;
- }
-
- // if old repeat field format
- if ( empty( $field['inner_columns_size'] ) ) {
- $field['inner_columns_size']['column-1'] = '100%';
- $field['inner_columns_size']['column-2'] = '100%';
- $field['inner_columns_size']['column-3'] = '100%';
+ $field['inner_fields'] = [];
+ } elseif ( isset( $field['inner_fields']['column-1'] ) ) {
+ // Convert column structure to simple array
+ $field['inner_fields'] = $field['inner_fields']['column-1'];
}
}