BlockStack gap issue inside Modal popup

[ttnbtfy]

Summary

Hi guys,

I have a problem with spacing with choices in ChoiceList component
Please look at the gif I attached, it is too stretched compared to the original

Check my image:

https://imgur.com/hhhWsic

I have tried to solve the problem but without success, can anyone give me a solution?
Thank you.

Expected behavior

The block stack gap must be set to 0

Actual behavior

The initial block stack gap is quite large

Steps to reproduce

My jsx code:

import { Modal, TitleBar, useAppBridge } from '@shopify/app-bridge-react';
import { Page, Button, Text, BlockStack, ChoiceList } from '@shopify/polaris';

const App = () => {
	const shopify = useAppBridge();

	return (
		<Page>
			<Button onClick={ () => shopify.modal.show( 'my-modal' ) }>Show modal</Button>

			<Modal id="my-modal">
				<TitleBar title="Testimonial">
					<button>Cancel</button>
					<button>Install</button>
				</TitleBar>

				<Box padding="400">
					<BlockStack gap="300">
						<Text variant="bodyMd" as="p">The section will be deleted in the specified theme, and still in other themes (have <Badge>Installed</Badge> badge), until it is removed.</Text>

						<ChoiceList title="Themes:" choices={ choiceThemeList } selected={ selected } onChange={ handleChange } />
					</BlockStack>
				</Box>
			</Modal>
		</Page>
	);
};

export default App;

Are you using React components?

No

Polaris version number

No response

Browser

No response

Device

No response