FontsizePicker wrongly measures units for selecting elements

I see that WordPress shows incorrect information from units of Fontsize picker If the user opts for the labels of the labels S / M / L / XL / XXL ‘.

This component does not correctly indicate the units of measurement when switching between different situations. Ideally, it should show the font size in “PX”, but in fact it shows the value in “brake”, but it writes that it is “PX”.

Can anyone help solve this? Mine Plug -in example

    <?php
import { __ } from '@wordpress/i18n';
import { RichText, InspectorControls, FontSizePicker, useBlockProps } from '@wordpress/block-editor';
import { PanelBody } from '@wordpress/components';
import { useEffect, useMemo } from '@wordpress/element';
import './editor.scss';

function normalizeSize( value ) {
        if ( value === undefined || value === null || value === '' ) {
                return undefined;
        }
        if ( typeof value === 'number' ) {
                return value;
        }

        const m = String( value ).match( /^([\d.]+)/ );
        if ( m ) {
                return parseFloat( m[1] );
        }
        return undefined;
}

export default function Edit({ attributes, setAttributes }) {
        const { otherSiteTitle, titleFontSize, titleFontUnit } = attributes;

        const numericFontSize = normalizeSize( titleFontSize );
        const fontSizeValue = numericFontSize ? `${ numericFontSize }${ titleFontUnit || 'px' }` : undefined;

        useEffect(() => {
                console.log('[DEBUG block attrs]', { titleFontSize, titleFontUnit, numericFontSize, fontSizeValue, otherSiteTitle });
        }, [ titleFontSize, titleFontUnit, otherSiteTitle, numericFontSize, fontSizeValue ]);

        const blockProps = useBlockProps();
        const wrapperKey = useMemo(() => `font-${fontSizeValue || 'default'}`, [ fontSizeValue ]);

        return (
                <>
                        <InspectorControls>
                                <PanelBody title={ __( 'Typography', 'test-font-size' ) } initialOpen={ true }>
                                        <FontSizePicker
                                                fontSizes={[
                                                        { name: 'Small', size: 12, slug: 'small' },
                                                        { name: 'Normal', size: 16, slug: 'normal' },
                                                        { name: 'Big', size: 26, slug: 'big' },
                                                ]}
                                                value={ numericFontSize !== undefined ? numericFontSize : undefined }
                                                onChange={ ( newSize ) => {
                                                        setAttributes({
                                                                titleFontSize: newSize === undefined ? '' : newSize,
                                                                titleFontUnit: 'px',
                                                        });
                                                }}
                                                withSlider
                                        />
                                </PanelBody>
                        </InspectorControls>

                        <div
                                key={ wrapperKey }
                                { ...blockProps }
                                style={ {
                                        fontSize: fontSizeValue,
                                } }
                        >
                                <RichText
                                        tagName="p"
                                        value={ otherSiteTitle }
                                        onChange={ ( val ) => setAttributes({ otherSiteTitle: val }) }
                                        placeholder={ __( 'Add other side text', 'test-font-size' ) }
                                />
                        </div>
                </>
        );
}

#FontsizePicker #wrongly #measures #units #selecting #elements