Hi Jules, hope this PR finds you well.

I have encountered 2 issues with a recent development on my Smart Grid-layout plugin which uses the HybridDropdown js plugin to display dynamic lists of checkboxes.

1. Event fired by fields added post page load not picked up.

The HybridDropdown is built and initialised from a JSON object once the document is ready, creating a list of checkbox in an HTML dropdown field. As a result, your front-end script's input change event handler,

Wpcf7cfForm.prototype.updateEventListeners = function() {

    var form = this;

    // monitor input changes, and call displayFields() if something has changed
    form.get('input, select, textarea, button').not('.wpcf7cf_add, .wpcf7cf_remove').off(wpcf7cf_change_events).on(wpcf7cf_change_events,form, function(e) {

fails to pik up the list of checkboxes as it has yet to be instantiated when your script binds events to the input fields.

I therefore suggest the following change which works just as well,

Wpcf7cfForm.prototype.updateEventListeners = function () {
  var form = this; // monitor input changes, and call displayFields() if something has changed

  form.$form.off(wpcf7cf_change_events).on(wpcf7cf_change_events, form.get('input, select, textarea, button').not('.wpcf7cf_add, .wpcf7cf_remove'), function (e) {

bind the event listener on the form and use event delegation to filter them. This has the advantage of binding fewer event listeners (more efficient) but also catching events fired by fields which were added post page load.

2. clear_on_hide not working for pure js event listeners

The 2nd issue is again related to the HybridDropdown field which implement a pure js event listening functionality to change the field when an external/programmatic 'change' event is fired on one of its checkbox fields.

Your front-end scripts uses the jQuery trigger method to fire a change event,

 $inputs.trigger("change");

Unfortunately the trigger method has a downside that the event fired on a checkbox does not bubble up, see this StackOverflow answer for more details. I therefore propose to use the js dispatchEvent method to fire the event,

 $inputs.each(function(){this.dispatchEvent(new Event("change",{"bubbles":true}))});

what do you think?