/**
 * File Path: assets/js/wizard/wizard-footer.js
 *
 * MBS Setup Wizard -- Footer navigation bar (Back / secondary / Next).
 * Attaches Footer to window.MBSWizardParts.
 *
 * @package MyBookShowroom
 * @since   1.2.0
 */

(function( wp ) {
    'use strict';
    var __ = wp.i18n.__;

    if ( ! wp || ! wp.element ) {
        return;
    }

    var h = wp.element.createElement;
    var P = window.MBSWizardParts = window.MBSWizardParts || {};

    function Footer( props ) {
        return h( 'div', { style: {
                display: 'flex', alignItems: 'center', gap: '10px',
                padding: '18px 56px', borderTop: '1px solid #E0D8C8',
                flexShrink: 0,
        }},
            props.onBack
                ? h( 'button', {
                    className: 'mbs-wizard-btn mbs-wizard-btn--ghost',
                    onClick: props.onBack,
                    disabled: props.loading,
                }, '\u2190 ' + __( 'Back', 'my-book-showroom' ) )
                : null,
            h( 'div', { style: { flex: 1 } } ),
            props.secondaryLabel
                ? h( 'button', {
                    className: 'mbs-wizard-btn mbs-wizard-btn--ghost',
                    onClick: props.onSecondary,
                    disabled: props.loading,
                    style: { fontSize: '12px', color: '#9AABBA', borderColor: 'transparent' },
                }, props.secondaryLabel )
                : null,
            h( 'button', {
                className: 'mbs-wizard-btn mbs-wizard-btn--primary',
                onClick: props.onNext,
                disabled: props.loading,
            }, props.loading ? __( 'Working\u2026', 'my-book-showroom' ) : ( props.nextLabel || ( __( 'Continue', 'my-book-showroom' ) + ' \u2192' ) ) )
        );
    }

    P.Footer = Footer;

})( window.wp );
