描述bug

我正在尝试创建一个故事，根据文档，JSX元素不可被JSON序列化，因此我不能将它们直接作为选项传递给我的控件。由于这个原因，我正在使用Map功能将单选控件字符串选项Map到StyledComponents。
然而，尽管代码实际上似乎起作用了，但在定义args属性中的默认值时，TypeScript抱怨'string' is not assignable to ReactElement:

import type { Meta } from '@storybook/react';
import { StoryObj } from '@storybook/react';
import { styled } from '@mui/material';
import OverflowTooltip from './overflow-tooltip';

const Child = styled('div')({
	maxWidth: '10em',
	overflow: 'hidden',
	textOverflow: 'ellipsis',
	whiteSpace: 'nowrap',
});

const shortText = 'Short text';
const longText = 'This is a long text that overflows';

const meta: Meta<typeof OverflowTooltip> = {
	component: OverflowTooltip,
	title: 'Packages/Core/Overflow Tooltip',
	args: {
		title: longText,
		children: 'Short', // <--- Typescript complains about this
	},
	argTypes: {
		// ...
		children: {
			name: 'Child Text',
			control: 'radio',
			options: ['Short', 'Long'],
			mapping: {
				Short: <Child>{shortText}</Child>,
				Long: <Child>{longText}</Child>,
			},
			description:
				'If a long text is selected the content will overflow and the tooltip should show up.',
		},
	},
};

我认为这是一个bug,但我也可能是做错了什么，有什么反馈吗？

重现问题

• 无响应*

系统信息

System:
    OS: Windows 10 10.0.20348
    CPU: (8) x64 Intel(R) Xeon(R) Gold 6258R CPU @ 2.70GHz
Binaries:
    Node: 18.15.0 - C:\Program Files\nodejs\node.EXE
    npm: 9.5.0 - C:\Program Files\nodejs\npm.CMD
Browsers: {}
npmPackages:
    @storybook/addon-essentials: ^7.0.7 => 7.0.20 
    @storybook/core-common: ^7.0.7 => 7.0.20 
    @storybook/core-server: ^7.0.7 => 7.0.20 
    @storybook/react-vite: ^7.0.7 => 7.0.20

附加上下文

我尝试省略那一行，但我得到了以下错误：

我还尝试直接将值分配给children arg/prop:

children: <Child>{shortText}</Child>

但是我在控制台中收到了以下警告：