根据Storybook的文档：https://storybook.js.org/docs/react/workflows/stories-for-multiple-components

// List.stories.ts | List.stories.tsx

import React from 'react';

import { List, ListProps } from './List';

//👇 Instead of importing ListItem, we import the stories
import { Unchecked } from './ListItem.stories';

const Template: Story<ListProps> = (args) => <List {...args} />;

export const OneItem = Template.bind({});
OneItem.args = {
  children: <Unchecked {...Unchecked.args} />,
};

故事可以像React元素一样用于儿童。
然而，我的代码遵循了doc示例，但在下面抛出了一个错误。
bound Template cannot be used as component.
我的代码：

// checkFormField.stories.tsx

import { Meta, Story } from '@storybook/react';
import CheckFormField from '@components/old/signup/organisms/checkFormField/index';
import { CheckboxProps } from '@components/old/signup/molecules/checkbox/interfaces';

//👇 Instead of importing ListItem, we import the stories
import {DefaultCheckbox} from '@components/old/signup/molecules/checkbox/checkbox.stories';

export default {
  title: 'checkFormField',
  component: CheckFormField,
} as Meta;

const Template: Story = (args) => <CheckFormField {...args}/>

export const OneItem = Template.bind({})
OneItem.args = {
  children: [<DefaultCheckbox {...DefaultCheckbox.args as CheckboxProps}/>]
}

// checkbox.stories.tsx

import { Meta, Story } from '@storybook/react';
import Checkbox from '@components/old/signup/molecules/checkbox/index';
import { CheckboxProps } from '@components/old/signup/molecules/checkbox/interfaces';

export default {
  title: 'checkbox',
  component: Checkbox,
} as Meta;

const Template: Story<CheckboxProps> = (args) => <Checkbox {...args} />;

export const DefaultCheckbox = Template.bind({});

DefaultCheckbox.args = {
  id: 'test',
  labelText: 'Default Checkbox',
  tabIndex: 0,
  checked: false,
  isDiners: false,
};

我知道下面的警告是这样说的：

Avoid using empty values

Use caution with components that include third party libraries

**因为它们可能会导致你的故事书出错。

但我只是想知道，如果我错过了什么和实现的方式。
先谢谢你了。