Create something that can be added or removed in Customizer

Question

I'm working on the Wordpress Customizer in my theme. Now suppose i want to create a kind of item with 3 options (in this case, an image and 2 inputs), and i want to let the user to create many of these. I know how to create the text inputs:

$wp_customizer->add_setting('fantastic-input', array(
    'type' => 'theme_mod',
    'default' => 'Make something fantastic!'
));

$wp_customizer->add_control('fantastic-input-opt', array(
    'type' => 'input',
    'section' => 'fantastic-section',
    'settings' => 'fantastic-input',
    'label' => _('Input something fantastic here'),
    'description' => 'This input is fantastic!'
));

and to add an Image selector:

$wp_customizer->add_setting('fantastic-image', array(
    'type' => 'theme_mod',
    'default' => ''
));

$wp_customizer->add_control(new WP_Customize_Image_Control (
    $wp_customizer,
    'fantastic-image',
    array(
        'label' => _('Best image ever'),
        'section' => 'fantastic-section',
    )
));

But what if i don't want this to be the only one of its kind? Thank you.

EDIT

I'm thinking about a possible solution being to create a custom control with all the needed fields inside, extending WP_Customize_Control. I could think about some way to encode all of them in a json string, or something that makes them easy to manage together. Possible code for custom control:

class Custom_Control extends WP_Customize_Control {
    public $type = 'my-custom-control';

    //As seen by admin
    public function render_content() {
        $picture = new WP_Customize_Image_Control();
        $picture->render_content();
        ?>
        <input type="text" name="title" placeholder="" />
        <input type="text" name="cta" placeholder="" />
        <textarea name="textbody"></textarea>
        <?php
    }
    //Load js to handle this
    public function enqueue () {
        wp_enqueue_script('something.js', 'somepath', array( 'jquery' ));
    }
}

Is this ok? And what about the picture control? How to include it?

Answer 1

I ended up integrating Kirki in my theme.

How to integrate it: I created a new folder, named includes in my theme. Then, in my functions.php, i added this line:

include_once( dirname( __FILE__ ) . '/include/kirki/kirki.php' );

Now, the main point: create replicable items
Kirki features a bigger list of control types. The one we want is named repeater. To use it (as with any of Kirki's controls) you need to create a config and a section, but the setting is auto-created:

Kirki::add_config('awesome_config', array(
    'capability'    => 'edit_theme_options',
    'option_type'   => 'theme_mod',
));

Kirki::add_section('awesome_section', array(
    'title' => _('Awesome section'),
    'description' => _(''),
    'capability'     => 'edit_theme_options'
));

Now, keeping in mind these 2 elements, we can finally create our repeater control:

Kirki::add_field('awesome_config', array (
    'type' => 'repeater',
    'settings' => 'awesome_setting',
    'label' => _('Awesome repeater'),
    'section' => 'awesome_section',
    'fields' => array(
        'field1' => array(
            'type' => 'text',
            'label' => _('Field 1'),
            'default' => ''
        ),
    'field2' => array(
            'type' => 'text',
            'label' => _('Field 2'),
            'default' => ''
        ),
    )
));

As shown, you can not only create fields that user can replicate, but also add many fields in there!