Tweak: Enable [active_callback] For Repeater's Children

[HadyShaltout]

Version 4.1.1

Here's the solution of using [active_callback] array inside repeater controls to allow you show/hide other controls inside repeater's rows.

We've added the code in the unminified JS files until Kirki team decide to accept it and merge it to be able to minify via their minification tool.

The changes MUST be added to minfied version of js files:

File 1 - Unminified
.\kirki\kirki-packages\module-field-dependencies\src\control.js

File 1 - Minified
.\kirki\kirki-packages\module-field-dependencies\dist\control.js

File 2 - Unminified
.\kirki\kirki-packages\control-repeater\src\control.js

File 2 - Minified
.\kirki\kirki-packages\control-repeater\dist\control.js

Full Example:

new \Kirki\Field\Repeater( [

    'settings'     => '_builder_repeater',
    'label'       => esc_html__('Builder', 'text-domain'),
    'description' => '',
    'help'        => '',
    'section'     => 'section_id',
    'default'     => '',
    'priority'    => 10,

    'row_label' => array(
        'type'  => 'field',
        'value' => esc_html__('Layout', 'text-domain' ),
        'field' => 'layout',
    ),

    'default'     => array(),

    'fields' => array(
        'layout' => array(
            'type'        => 'select',
            'label'       => esc_html__( 'The Box Layout', 'text-domain' ),
            'description' => '',
            'default'     => 'classic',
            'choices'       => array(
                'horizontal'     => esc_html__( 'Horizontal', 'text-domain' ),
                'vertical'      => esc_html__( 'Vertical', 'text-domain' ),
                'review'       => esc_html__( 'Best Reviews', 'text-domain' ),
            )
        ),

        'title' => array(
            'type'        => 'text',
            'label'       => esc_html__( 'Title', 'text-domain' ),
            'description' => '',
            'default'     => '',
        ),

        'category' => array(
            'type'        => 'select',
            'label'       => esc_html__( 'Category', 'text-domain' ),
            'description' => '',
            'default'     => 'img',
            'choices'       => array(
                'img'   => esc_html__( 'Images', 'text-domain' ),
                'video'     => esc_html__( 'Video', 'text-domain' ),
                'audio'      => esc_html__( 'Audio', 'text-domain' ),
            ),
        ),

        'title_2' => array(
            'type'        => 'text',
            'label'       => esc_html__( 'Title #2', 'text-domain' ),
            'description' => '',
            'default'     => '',
            'active_callback'      => array(
                array(
                    'setting'  => 'layout',
                    'operator' => '==',
                    'value'    => 'vertical',
                ),
                array(
                    'setting'  => 'category',
                    'operator' => '==',
                    'value'    => 'video',
                )
            )
        ),
        'cat_2' => array(
            'type'        => 'select',
            'label'       => esc_html__( 'Category #2', 'text-domain' ),
            'description' => '',
            'default'     => 'animal',
            'choices'       => array(
                'animal'   => esc_html__( 'Animals', 'text-domain' ),
                'flys'     => esc_html__( 'Flys', 'text-domain' ),
            ),
            'active_callback'      => array(
                array(
                    'setting'  => 'layout',
                    'operator' => '==',
                    'value'    => 'vertical',
                )
            )
        ),


        'rev_title' => array(
            'type'        => 'text',
            'label'       => esc_html__( 'Review Title', 'text-domain' ),
            'description' => '',
            'default'     => '',
            'active_callback'      => array(
                array(
                    'setting'  => 'layout',
                    'operator' => '==',
                    'value'    => 'review',
                )
            )
        ),

    )

] );