我有一个Chip组件，它从它的leftSection属性中接受一个额外的元素，一个ReactNode。
然后，我有以下故事元数据：

const meta = {
  component: Chip,
  argTypes: {
    label: { control: 'text' },
    leftSection: {
      control: 'select',
      options: ['none', 'swatch'],
    },
    swatchColor: {
      control: 'color',
      if: { arg: 'leftSection', eq: 'swatch' },
    },
  },
} as Meta<Component>;

Chip组件没有swatchColor属性，它只在故事书上定义，用于编辑故事书本身的值。
但是在编写story对象时，它会引发一个类型错误：

export const Default: StoryObj<Component> = {
  render: (args) => {
    const { leftSection, swatchColor, ...rest } = args;
    //                   ^ type error here: Property 'swatchColor' does not exist

    if (leftSection === 'swatch') {
      return (
        <Chip
          leftSection={<ColorSwatch color={swatchColor} />}
          {...rest}
        />
      );
    }

    return <Chip {...rest} />;
  },

  args: {
    label: 'foo',
    leftSection: 'none',
  },
};

尽管它可以工作，但我想在我有类型安全的同时修复类型错误。
有没有一种方法可以对故事进行额外的控制，同时仍然让TS/故事书感到高兴？