← All changes | includes/page-form-builder/_src/bfb-rightbar-tabs.js +83 -6 11.4.3 → 11.9 View file →

		@@ -383,14 +383,86 @@
383	383
384	384	return true;
385	385	}
386	386
	387	+ /**
	388	+ * Open one collapsible Add Fields palette group.
	389	+ *
	390	+ * The setup-wizard deep link uses this helper to reveal a field pack without
	391	+ * inserting or otherwise changing the current booking form.
	392	+ *
	393	+ * @param {string} group_key Palette group key from its data-group attribute.
	394	+ * @returns {boolean} Whether the requested palette group was found and opened.
	395	+ */
	396	+ function open_palette_group(group_key) {
	397	+ const panel = d.getElementById( 'wpbc_bfb__palette_add_new' ) || d;
	398	+ const group = panel.querySelector( '.wpbc_bfb__inspector__group[data-group="' + esc_attr_selector_value( group_key ) + '"]' );
	399	+ if ( ! group ) {
	400	+ return false;
	401	+ }
	402	+
	403	+ const header = group.querySelector( '.group__header' );
	404	+ const fields = group.querySelector( '.group__fields' );
	405	+
	406	+ group.classList.add( 'is-open' );
	407	+ if ( header ) {
	408	+ header.setAttribute( 'aria-expanded', 'true' );
	409	+ }
	410	+ if ( fields ) {
	411	+ fields.removeAttribute( 'hidden' );
	412	+ fields.setAttribute( 'aria-hidden', 'false' );
	413	+ }
	414	+
	415	+ return true;
	416	+ }
	417	+
	418	+ /**
	419	+ * Focus and visually highlight one Add Fields palette item.
	420	+ *
	421	+ * @param {string} field_type Registered Form Builder field type.
	422	+ * @returns {boolean} Whether the requested field pack palette item was found.
	423	+ */
	424	+ function focus_palette_field(field_type) {
	425	+ const panel = d.getElementById( 'wpbc_bfb__palette_add_new' ) || d;
	426	+ const field = panel.querySelector( '.wpbc_bfb__field[data-type="' + esc_attr_selector_value( field_type ) + '"]' );
	427	+ if ( ! field ) {
	428	+ return false;
	429	+ }
	430	+
	431	+ try {
	432	+ field.scrollIntoView( { behavior: 'smooth', block: 'center', inline: 'nearest' } );
	433	+ } catch ( _e ) {
	434	+ field.scrollIntoView( true );
	435	+ }
	436	+
	437	+ field.classList.remove( 'wpbc_bfb__scroll-pulse', 'wpbc_bfb__highlight-pulse' );
	438	+ void field.offsetWidth;
	439	+ field.classList.add( 'wpbc_bfb__scroll-pulse', 'wpbc_bfb__highlight-pulse' );
	440	+ field.setAttribute( 'tabindex', '-1' );
	441	+
	442	+ setTimeout( () => {
	443	+ field.classList.remove( 'wpbc_bfb__scroll-pulse', 'wpbc_bfb__highlight-pulse' );
	444	+ }, 2200 );
	445	+ setTimeout( () => {
	446	+ try {
	447	+ field.focus( { preventScroll: true } );
	448	+ } catch ( _e ) {
	449	+ field.focus();
	450	+ }
	451	+ }, 250 );
	452	+
	453	+ return true;
	454	+ }
	455	+
387	456	let deep_link_done = false;
388	457	let deep_link_ajax_listener_bound = false;
389	458
390	459	function has_initial_deep_link() {
391	460	const params = get_url_params();
392		- return !! ( params && 'form_settings' === params.get( 'wpbc_bfb_panel' ) );
	461	+ return !! (
	462	+ params
	463	+ && -1 !== [ 'form_settings', 'add_fields' ].indexOf( params.get( 'wpbc_bfb_panel' ) )
	464	+ );
393	465	}
394	466
395	467	function handle_initial_deep_link(tabs, attempt = 0) {
396	468	if ( deep_link_done ) {
		@@ -397,14 +469,15 @@
397	469	return;
398	470	}
399	471
400	472	const params = get_url_params();
401		- if ( ! params || 'form_settings' !== params.get( 'wpbc_bfb_panel' ) ) {
	473	+ if ( ! params || -1 === [ 'form_settings', 'add_fields' ].indexOf( params.get( 'wpbc_bfb_panel' ) ) ) {
402	474	return;
403	475	}
404	476
405		- const panel_id = 'wpbc_bfb__inspector_form_settings';
406		- const tab = d.getElementById( 'wpbc_tab_form' );
	477	+ const panel_mode = params.get( 'wpbc_bfb_panel' );
	478	+ const panel_id = 'add_fields' === panel_mode ? 'wpbc_bfb__palette_add_new' : 'wpbc_bfb__inspector_form_settings';
	479	+ const tab = d.getElementById( 'add_fields' === panel_mode ? 'wpbc_tab_library' : 'wpbc_tab_form' );
407	480	const panel = d.getElementById( panel_id );
408	481	if ( ! tab || ! panel ) {
409	482	if ( attempt < 25 ) {
410	483	setTimeout( () => handle_initial_deep_link( tabs, attempt + 1 ), 80 );
		@@ -415,10 +488,14 @@
415	488	tabs.show_panel( panel_id, tab );
416	489
417	490	const group_key = params.get( 'wpbc_bfb_group' );
418	491	const row_key = params.get( 'wpbc_bfb_focus' );
419		- const group_ok = group_key ? open_settings_group( group_key ) : true;
420		- const row_ok = row_key ? focus_settings_row( row_key ) : true;
	492	+ const group_ok = group_key
	493	+ ? ( 'add_fields' === panel_mode ? open_palette_group( group_key ) : open_settings_group( group_key ) )
	494	+ : true;
	495	+ const row_ok = row_key
	496	+ ? ( 'add_fields' === panel_mode ? focus_palette_field( row_key ) : focus_settings_row( row_key ) )
	497	+ : true;
421	498
422	499	if ( ( ! group_ok || ! row_ok ) && attempt < 25 ) {
423	500	setTimeout( () => handle_initial_deep_link( tabs, attempt + 1 ), 80 );
424	501	return;