2022-01-05 16:28:56 +00:00
|
|
|
import { Meta } from '@storybook/react';
|
|
|
|
import { useState } from 'react';
|
|
|
|
|
|
|
|
import { TeamsSelector } from './TeamsSelector';
|
|
|
|
import { createMockTeam } from './TeamsSelector.mocks';
|
|
|
|
|
|
|
|
const meta: Meta = {
|
|
|
|
title: 'Components/TeamsSelector',
|
|
|
|
component: TeamsSelector,
|
|
|
|
};
|
|
|
|
|
|
|
|
export default meta;
|
|
|
|
export { Example };
|
|
|
|
|
|
|
|
function Example() {
|
2022-09-21 07:10:58 +00:00
|
|
|
const [selectedTeams, setSelectedTeams] = useState<readonly number[]>([1]);
|
2022-01-05 16:28:56 +00:00
|
|
|
|
|
|
|
const teams = [createMockTeam(1, 'team1'), createMockTeam(2, 'team2')];
|
|
|
|
|
|
|
|
return (
|
|
|
|
<TeamsSelector
|
|
|
|
value={selectedTeams}
|
2022-09-21 07:10:58 +00:00
|
|
|
onChange={(value) => setSelectedTeams(value)}
|
2022-01-05 16:28:56 +00:00
|
|
|
teams={teams}
|
|
|
|
placeholder="Select one or more teams"
|
|
|
|
/>
|
|
|
|
);
|
|
|
|
}
|