Skip to content

Add new align option hooks #2593

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Crabcyborg merged 15 commits into from
Jun 4, 2026
Merged

Add new align option hooks #2593

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
8036909
Add new align option hooks
Crabcyborg Nov 19, 2025
fefdecc
Make sure new options work as expected
AbdiTolesa Nov 20, 2025
41fa639
Make sure new align settings in style work as expected
AbdiTolesa Nov 20, 2025
252e94a
Move out code to get choices layout from style settings to Pro
AbdiTolesa Nov 20, 2025
3ace44c
Make sure builder live changes work well with U
AbdiTolesa Nov 21, 2025
46dcd15
Add additional attribute to align options filter
AbdiTolesa Nov 25, 2025
220661b
Default align setting to empty use from style alignment option
AbdiTolesa Nov 25, 2025
a0154e3
Update default options alignment for Checkbox and Radio field classes
AbdiTolesa Nov 25, 2025
62f5639
Merge master
AbdiTolesa Nov 25, 2025
5ae0983
Build files
AbdiTolesa Nov 25, 2025
fa86fd5
Make FrmFieldType::prepare_align_class called object oriented
AbdiTolesa Jan 5, 2026
d0c6146
Merge branch 'master' into new_align_option_hooks
Crabcyborg Jun 2, 2026
2146d17
Merge branch 'master' into new_align_option_hooks
Crabcyborg Jun 4, 2026
7bf6de9
Improve checks for align setting before adding to classes
Crabcyborg Jun 4, 2026
ec2b30d
Use simplified return
Crabcyborg Jun 4, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 1 addition & 3 deletions classes/models/fields/FrmFieldCheckbox.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -84,10 +84,8 @@ public function displayed_field_type( $field ) {
* @return array
*/
protected function extra_field_opts() {
$form_id = $this->get_field_column( 'form_id' );

return array(
'align' => FrmStylesController::get_style_val( 'check_align', $form_id ? $form_id : 'default' ),
'align' => '',
);
}

Expand Down
4 changes: 1 addition & 3 deletions classes/models/fields/FrmFieldRadio.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,10 +75,8 @@ public function displayed_field_type( $field ) {
* @return array
*/
protected function extra_field_opts() {
$form_id = $this->get_field_column( 'form_id' );

return array(
'align' => FrmStylesController::get_style_val( 'radio_align', $form_id ? $form_id : 'default' ),
'align' => '',
);
}

Expand Down
16 changes: 7 additions & 9 deletions classes/models/fields/FrmFieldType.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1066,17 +1066,15 @@ protected function after_replace_html_shortcodes( $args, $html ) {
* @return string
*/
public function get_container_class() {
$is_radio = FrmField::is_radio( $this->field );
$is_checkbox = FrmField::is_checkbox( $this->field );
$align = FrmField::get_option( $this->field, 'align' );
$class = '';

if ( $align && ( $is_radio || $is_checkbox ) ) {
self::prepare_align_class( $align );
$class .= ' ' . $align;
if ( ! FrmField::is_radio( $this->field ) && ! FrmField::is_checkbox( $this->field ) ) {
return '';
}

return $class;
$align = FrmField::get_option( $this->field, 'align' );

$this->prepare_align_class( $align );

return $align ? ' ' . $align : '';
}

/**
Expand Down
31 changes: 23 additions & 8 deletions classes/views/styles/_check-box-radio-fields.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,15 +64,25 @@ class="frm-style-item-heading"><?php esc_html_e( 'Check Box', 'formidable' ); ?>
</div>
<div class="frm7 frm_form_field">
<?php
$align_options = array(
'block' => __( 'One Column', 'formidable' ),
'inline' => __( 'Inline Options', 'formidable' ),
);

/**
* @since x.x
*
* @param array $align_options
* @param array $atts
*/
$checkbox_align_options = apply_filters( 'frm_checkbox_align_options', $align_options, $atts );
Copy link
Copy Markdown

@deepsource-io deepsource-io Bot Jun 2, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Variable $atts might not be defined


A variable has been used but not defined, which may result in warnings during program execution. This can also cause bugs since the intended usage scope of the variable is not known.

Copy link
Copy Markdown

@deepsource-io deepsource-io Bot Jun 2, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Function apply_filters invoked with 3 parameters, 2 required


The function call is not valid, which will result in a fatal runtime error.


new FrmDropdownStyleComponent(
$frm_style->get_field_name( 'check_align' ),
Copy link
Copy Markdown

@deepsource-io deepsource-io Bot Jun 2, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Variable $frm_style might not be defined


A variable has been used but not defined, which may result in warnings during program execution. This can also cause bugs since the intended usage scope of the variable is not known.

$style->post_content['check_align'],
Copy link
Copy Markdown

@deepsource-io deepsource-io Bot Jun 2, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Variable $style might not be defined


A variable has been used but not defined, which may result in warnings during program execution. This can also cause bugs since the intended usage scope of the variable is not known.

array(
'id' => 'frm_check_align',
'options' => array(
'block' => esc_html__( 'Multiple Rows', 'formidable' ),
'inline' => esc_html__( 'Single Row', 'formidable' ),
),
'options' => $checkbox_align_options,
)
);
?>
Expand All @@ -85,15 +95,20 @@ class="frm-style-item-heading"><?php esc_html_e( 'Radio', 'formidable' ); ?></la
</div>
<div class="frm7 frm_form_field">
<?php
/**
* @since x.x
*
* @param array $align_options
* @param array $atts
*/
$radio_align_options = apply_filters( 'frm_radio_align_options', $align_options, $atts );
Copy link
Copy Markdown

@deepsource-io deepsource-io Bot Jun 2, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Variable $atts might not be defined


A variable has been used but not defined, which may result in warnings during program execution. This can also cause bugs since the intended usage scope of the variable is not known.

Copy link
Copy Markdown

@deepsource-io deepsource-io Bot Jun 2, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Function apply_filters invoked with 3 parameters, 2 required


The function call is not valid, which will result in a fatal runtime error.


new FrmDropdownStyleComponent(
$frm_style->get_field_name( 'radio_align' ),
Copy link
Copy Markdown

@deepsource-io deepsource-io Bot Jun 2, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Variable $frm_style might not be defined


A variable has been used but not defined, which may result in warnings during program execution. This can also cause bugs since the intended usage scope of the variable is not known.

$style->post_content['radio_align'],
Copy link
Copy Markdown

@deepsource-io deepsource-io Bot Jun 2, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Variable $style might not be defined


A variable has been used but not defined, which may result in warnings during program execution. This can also cause bugs since the intended usage scope of the variable is not known.

array(
'id' => 'frm_radio_align',
'options' => array(
'block' => esc_html__( 'Multiple Rows', 'formidable' ),
'inline' => esc_html__( 'Single Row', 'formidable' ),
),
'options' => $radio_align_options,
)
);
?>
Expand Down
2 changes: 1 addition & 1 deletion js/formidable_admin.js
View file
Open in desktop

Large diffs are not rendered by default.

3 changes: 3 additions & 0 deletions js/src/admin/admin.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6963,6 +6963,9 @@ window.frmAdminBuildJS = function() {
let replaceWith = ` ${ setting.value }`;
const fieldId = field.getAttribute( 'data-fid' );

if ( '' === replaceWith.trim() ) {
replaceWith = ' ' + setting.querySelector( 'option[data-align]' ).getAttribute( 'data-align' );
Copy link
Copy Markdown

@deepsource-io deepsource-io Bot Jun 2, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unexpected string concatenation


In ES2015 (ES6), we can use template literals instead of string concatenation.

}
Comment on lines +6966 to +6968
Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot Nov 25, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟠 Major

Guard data-align fallback and use the selected option instead of the first match

The new fallback assumes:

  • setting always has an option[data-align], and
  • the first such option is the one currently selected.

This can cause issues:

  1. Potential runtime error: If setting is a text input (e.g., .frm_classes) with an empty value, or a <select> without any option[data-align], then setting.querySelector( 'option[data-align]' ) returns null and .getAttribute( 'data-align' ) will throw.

  2. Wrong alignment when multiple options have data-align: querySelector( 'option[data-align]' ) always returns the first matching option, not the selected one, so the applied class may not match the user’s current choice.

  3. Over‑broad application: The fallback should only apply to the align dropdown (.field_options_align), not to every control wired through changeFieldClass.

Recommend tightening the logic to:

  • Only run for the align select.
  • Read data-align from the selected option.
  • Gracefully no‑op if no data-align is available.

For example:

-		if ( '' === replaceWith.trim() ) {
-			replaceWith = ' ' + setting.querySelector( 'option[data-align]' ).getAttribute( 'data-align' );
-		}
+		if ( '' === replaceWith.trim() && setting.classList.contains( 'field_options_align' ) ) {
+			const selectedOption = setting.options[ setting.selectedIndex ];
+			const dataAlign = selectedOption ? selectedOption.getAttribute( 'data-align' ) : '';
+
+			if ( dataAlign ) {
+				replaceWith = ' ' + dataAlign;
+			}
+		}

This keeps existing behavior for non‑align inputs, avoids exceptions when no data-align is present, and correctly respects the user’s selected alignment option.

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
if ( '' === replaceWith.trim() ) {
replaceWith = ' ' + setting.querySelector( 'option[data-align]' ).getAttribute( 'data-align' );
}
if ( '' === replaceWith.trim() && setting.classList.contains( 'field_options_align' ) ) {
const selectedOption = setting.options[ setting.selectedIndex ];
const dataAlign = selectedOption ? selectedOption.getAttribute( 'data-align' ) : '';
if ( dataAlign ) {
replaceWith = ' ' + dataAlign;
}
}
🤖 Prompt for AI Agents 
In js/src/admin/admin.js around lines 6734-6736, the fallback assumes
setting.querySelector('option[data-align]') exists and uses the first match;
change it so the fallback only runs when setting.matches('.field_options_align')
(the align select), then get the selected option
(setting.options[setting.selectedIndex] or
setting.querySelector('option:checked')) and read its data-align attribute; if
no selected option or no data-align is present, do nothing (no-op) to avoid
runtime errors and incorrect alignment application.

// Include classes from multiple settings.
if ( fieldId !== undefined ) {
if ( setting.classList.contains( 'field_options_align' ) ) {
Expand Down
Loading