( function ( wp ) {
    'use strict';

    var __ = wp.i18n.__;
    var el = wp.element.createElement;
    var InspectorControls = wp.blockEditor.InspectorControls;
    var PanelBody = wp.components.PanelBody;
    var blockProps = wp.blockEditor.useBlockProps;

    wp.blocks.registerBlockType( 'ambassadorhub/fundraiser-info', {
        edit: function ( props ) {
            var attrs = props.attributes;
            var set = props.setAttributes;
            var blockProps = wp.blockEditor.useBlockProps();
            return el(
                wp.element.Fragment,
                null,
                el( InspectorControls, null,
                    el( PanelBody, { title: __( 'Fundraiser Info', 'ambassadorhub' ), initialOpen: true },
                        el( 'p', null, __( 'Displays the root fundraiser\'s title, dates, and description.', 'ambassadorhub' ) ),
                        el( wp.components.TextControl, {
                            label: __( 'Content character limit', 'ambassadorhub' ),
                            type: 'number',
                            min: 0,
                            value: attrs.contentLimit || '',
                            onChange: function (v) { set( { contentLimit: v ? parseInt(v, 10) : 0 } ); },
                            help: __( 'Show only the first N characters of the description. Leave 0 for no limit.', 'ambassadorhub' )
                        } ),
                        el( wp.components.ToggleControl, {
                            label: __( 'Show "Read more" link', 'ambassadorhub' ),
                            checked: !!attrs.showReadMore,
                            onChange: function (v) { set( { showReadMore: v } ); },
                            help: __( 'Show a link to the root fundraiser page when the content is truncated.', 'ambassadorhub' )
                        } )
                    )
                ),
                el( 'div', blockProps,
                    el( wp.serverSideRender, {
                        block: 'ambassadorhub/fundraiser-info',
                        attributes: attrs
                    } )
                )
            );
        },
        save: function () {
            return null;
        },
    } );
} )( window.wp );
