<?php

// START COPYING HERE...

/**
 * Populate predefined CSS classes dropdown selector.
 *
 * Requires Beaver Builder v2.1.4 and newer!
 *
 * @param  array  $field      An array of setup data for the field.
 * @param  string $field_key  The field name/key.
 */
function beaver_builder_css_class_dropdown( $field, $field_key ) {

	// Processing

		if ( 'class' == $field_key ) {
			$field['options'] = array(

				'' => esc_html__( '- Choose from predefined classes -', 'textdomain' ),

				// Optgroup 1

					'optgroup-id-1' => array(
						'label'   => esc_html__( 'Optgroup 1 title:', 'textdomain' ),
						'options' => array(
							'my-class-1' => esc_html__( 'My custom class 1', 'textdomain' ),
							'my-class-2' => esc_html__( 'My custom class 1', 'textdomain' ),
						),
					),

				// Optgroup 2

					'optgroup-id-2' => array(
						'label'   => esc_html__( 'Optgroup 2 title:', 'textdomain' ),
						'options' => array(
							'my-class-3' => esc_html__( 'My custom class 3', 'textdomain' ),
						),
					),

			);
		}


	// Output

		return $field;

} // /beaver_builder_css_class_dropdown

add_filter( 'fl_builder_field_js_config', 'beaver_builder_css_class_dropdown', 10, 2 );

// ...STOP COPYING HERE. NOW YOU CAN INSERT THE CODE INTO YOUR PHP FILE.