Block Component Integration Steps

// FIRST STEPS

function.php code

require_once('core/acf.php');

/* for category block display above */
function custom_block_category($categories, $post) {
    $custom_category = array(
        array(
            'slug' => 'site-common-blocks',
            'title' => __('Common Blocks (Pages & Posts)', 'blocktheme'),
        //'icon'  => 'wordpress',
        ),
    );
    $categories = array_merge($custom_category, $categories);
    return $categories;
}
add_filter('block_categories_all', 'custom_block_category', 10, 2);

/* above code paste only in function file */

// SECOND STEPS 
CREATE acf.php file 
<?php

/**
 * @package WordPress
 * @subpackage WPS
 *
 * Description: ACF Custom Blocks 
 * Version: 1.0.0
 */
if (!defined('ABSPATH') || !function_exists('add_action') || !function_exists('plugins_url')) {
    die('exit');
}

add_action('acf/init', 'im_acf_init');

function im_acf_init() {
    if (function_exists('acf_register_block')) { 
        /* Banner Form */
        acf_register_block(array(
            'name' => 'banner-form',
            'title' => __('Banner Form'),
            'description' => __('A custom banner form on a page block.'),
            'render_callback' => 'im_acf_block_render_callback',
            'category' => 'site-common-blocks',
            'icon' => 'star-empty',
            'mode' => 'preview',
            'supports' => [
                'align' => false,
                'anchor' => true,
                'customClassName' => true,
                'jsx' => true,
            ],
            'example' => array(
                'attributes' => array(
                    'mode' => 'preview',
                    'data' => array(
                        '_is_preview' => 'true'
                    )
                )
            ),
        ));
        
    }
}

function im_acf_block_render_callback($block) {
    $slug = str_replace('acf/', '', $block['name']);

    if (file_exists(get_theme_file_path("/modules/content-{$slug}.php"))) {
        include( get_theme_file_path("/modules/content-{$slug}.php") );
    }
}
/* above code paste in acf.php */


// THIRD STEPS
/* Module Code - Create Module File in Separately content-banner-form.php */
<?php
/* Component - Home Banner Form */

// Block preview
if (!empty($block['data']['_is_preview'])) {
    ?>
    <figure class="is_preview" style="width:100%; height:300px; display: block;">
        <img aria-label="Table" style="width:100%;height:100%;display: block;object-position: center;object-fit: contain;" src="<?php echo get_template_directory_uri(); ?>/includes/modules/thumbs/banner-bottom-form.jpg" alt="Table">
    </figure>
    <?php
}

// Create id attribute allowing for custom "anchor" value.
$id = $block['id'];
if (!empty($block['anchor'])) {
    $id = $block['anchor'];
}

// Create class attribute allowing for custom "className" and "align" values.
$className = '';
if (!empty($block['className'])) {
    $className .= ' ' . $block['className'];
}

$banner_form_title = get_field('banner_form_title');
$banner_form_content = get_field('banner_form_content');
$banner_form = get_field('banner_form');
?>

<div <?php if ($id): ?>id="<?php echo $id; ?>"<?php endif; ?> class="banner-form <?php echo $className; ?>">
    <div class="container">
        <div class="row g-0 form-row">
            <div class="col-lg-4 left-col">
                <?php if ($banner_form_title): ?>
                    <h2 class="heading h3"><?php echo $banner_form_title; ?></h2>
                <?php endif; ?>
                <?php if ($banner_form_content): ?>
                    <div class="desc"><?php echo $banner_form_content; ?></div>
                <?php endif; ?>
            </div>
            <div class="col-lg-8 right-col">
                <?php
                if ($banner_form):
                    $post_id = $banner_form->ID;
                    $post_title = $banner_form->post_title;

                    if ($post_id) {
                        echo do_shortcode('[contact-form-7 id="' . esc_attr($post_id) . '"]');
                    } else {
                        echo '<p>No contact form selected.</p>';
                    }
                    ?>
                </div>
            <?php endif; ?>
        </div>
    </div>
</div>