How to add a changeable icon to component in storybook? - reactjs

Question

I have a component - a simple list with an icon, header and links. I need to add an icon in front of the header. So that you can choose which icon will be in the Storybook. I can't find it in the documentation. And I can't figure out how to do it. If you know how, please help me.
// ItemsList.tsx
import React, { ReactElement, ReactNode } from 'react';
import { myIcon1 } from 'src/icons/Icon1';
import { myIcon2 } from 'src/icons/Icon2';
interface ItemsList {
icon: ReactElement;
header: string;
children?: ReactNode;
}
export const ItemsList = ({ icon, header, children }: ItemsList) => (
<div>
{icon} // Have no idea how to add one of imported icons here??
<div>{header}</div>
<ul>{children}</ul>
</div>
);
My Story File:
// ItemsList.story.jsx
import { ItemsList } from './itemsList';
export default {
title: 'ItemsList',
component: ItemsList,
argTypes: {
icon: {
control: { type: 'radio', options: ['no icon', 'icon 1', 'icon 2'] },
},
header: {
type: 'string',
defaultValue: 'Header',
},
children: {
type: 'array',
name: 'label',
defaultValue: ['link 1', 'link 2', 'link 3'],
},
},
};
const Template = (args) => <ItemsList {...args} />;
export const Default = Template.bind({});
Default.args = {
icon: ????,
header: 'Header',
children: ['link 1', 'link 2', 'link 3'],
};