: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
/* global wpforms_builder, wpf */
* Form Builder Panel Loader module.
var WPForms = window.WPForms || {}; // eslint-disable-line no-var
WPForms.Admin = WPForms.Admin || {};
WPForms.Admin.Builder = WPForms.Admin.Builder || {};
WPForms.Admin.Builder.PanelLoader = WPForms.Admin.Builder.PanelLoader || ( function( document, window, $ ) {
* Public functions and properties.
el.$builder.trigger( 'wpformsBuilderLoaderReady' );
* Setup. Prepare some variables.
el.$builder = $( '#wpforms-builder' );
el.$form = $( '#wpforms-builder-form' );
el.$panels = el.$builder.find( '.wpforms-panels' );
vars.currentPanel = wpf.getQueryString( 'view' );
el.$builder.on( 'wpformsPanelSwitch', function( e, panel ) {
// Skip if the panel is still loading.
if ( el.$builder.find( `.wpforms-panel-${ panel }-button .wpforms-loading-spinner` ).length ) {
// Open the panel if it is already loaded.
if ( el.$panels.find( '#wpforms-panel-' + panel ).length ) {
* @param {string} panel Panel name.
app.showSpinner( panel );
$.post( wpforms_builder.ajax_url, {
nonce: wpforms_builder.nonce,
action: 'wpforms_builder_load_panel',
form_id: wpf.getQueryString( 'form_id' ), // eslint-disable-line camelcase
.done( function( response ) {
if ( ! response.success || ! response.data?.length ) {
// Show an error message.
app.displayErrorModal( `<p>${ wpforms_builder.error_load_templates }</p><p>${ wpforms_builder.error_contact_support }</p>` );
// Append panel to the DOM.
app.embedPanel( panel, response.data );
// Finalize switching to the panel.
app.switchPanel( panel );
// Trigger panel loaded event.
el.$builder.trigger( 'wpformsBuilderPanelLoaded', [ panel ] );
// Show an error message.
app.displayErrorModal( `<p>${ wpforms_builder.something_went_wrong }.</p><p>${ wpforms_builder.error_contact_support }</p>` );
app.hideSpinner( panel );
* @param {string} panel Panel name.
const $button = $( `.wpforms-panel-${ panel }-button` );
$button.find( `i.fa` ).addClass( 'wpforms-hidden' );
$button.prepend( '<i class="wpforms-loading-spinner wpforms-loading-white"></i>' );
* @param {string} panel Panel name.
const $button = $( `.wpforms-panel-${ panel }-button` );
$button.find( `i.fa` ).removeClass( 'wpforms-hidden' );
$button.find( `i.wpforms-loading-spinner` ).remove();
* @param {string} panel Panel slug.
* @param {string} panelHtml Panel HTML.
embedPanel( panel, panelHtml ) {
// Append panel to the DOM.
el.$panels.append( panelHtml );
* Finalize switching to the panel.
* @param {string} panel Panel slug.
$( '#wpforms-panels-toggle' ).find( 'button' ).removeClass( 'active' );
$( '.wpforms-panel' ).removeClass( 'active' );
$( `.wpforms-panel-${ panel }-button` ).addClass( 'active' );
$( `#wpforms-panel-${ panel }` ).addClass( 'active' );
history.replaceState( {}, null, wpf.updateQueryString( 'view', panel ) );
el.$builder.trigger( 'wpformsPanelSwitched', [ panel ] );
* Display modal window with an error message.
* @param {string} content Modal content.
displayErrorModal( content ) {
title : wpforms_builder.uh_oh,
icon : 'fa fa-exclamation-circle',
text : wpforms_builder.close,
// Provide access to public functions/properties.
}( document, window, jQuery ) );
WPForms.Admin.Builder.PanelLoader.init();