2022-07-23 00:39:50 +00:00
|
|
|
import { ComponentMeta } from "@storybook/react";
|
|
|
|
|
2022-08-24 20:18:42 +00:00
|
|
|
import AvatarGroup from "@calcom/ui/v2/core/AvatarGroup";
|
2022-07-23 00:39:50 +00:00
|
|
|
|
|
|
|
export default {
|
|
|
|
title: "Avatar/Group",
|
|
|
|
component: AvatarGroup,
|
|
|
|
} as ComponentMeta<typeof AvatarGroup>;
|
|
|
|
|
|
|
|
const IMAGES = [
|
|
|
|
{
|
|
|
|
image: "https://cal.com/stakeholder/peer.jpg",
|
|
|
|
alt: "Peer",
|
|
|
|
title: "Peer Richelsen",
|
|
|
|
},
|
|
|
|
{
|
|
|
|
image: "https://cal.com/stakeholder/bailey.jpg",
|
|
|
|
alt: "Bailey",
|
|
|
|
title: "Bailey Pumfleet",
|
|
|
|
},
|
|
|
|
{
|
|
|
|
image: "https://cal.com/stakeholder/alex-van-andel.jpg",
|
|
|
|
alt: "Alex",
|
|
|
|
title: "Alex Van Andel",
|
|
|
|
},
|
|
|
|
{
|
|
|
|
image: "https://cal.com/stakeholder/ciaran.jpg",
|
|
|
|
alt: "Ciarán",
|
|
|
|
title: "Ciarán Hanrahan",
|
|
|
|
},
|
|
|
|
{
|
|
|
|
image: "https://cal.com/stakeholder/peer.jpg",
|
|
|
|
alt: "Peer",
|
|
|
|
title: "Peer Richelsen",
|
|
|
|
},
|
|
|
|
{
|
|
|
|
image: "https://cal.com/stakeholder/bailey.jpg",
|
|
|
|
alt: "Bailey",
|
|
|
|
title: "Bailey Pumfleet",
|
|
|
|
},
|
|
|
|
{
|
|
|
|
image: "https://cal.com/stakeholder/alex-van-andel.jpg",
|
|
|
|
alt: "Alex",
|
|
|
|
title: "Alex Van Andel",
|
|
|
|
},
|
|
|
|
{
|
|
|
|
image: "https://cal.com/stakeholder/ciaran.jpg",
|
|
|
|
alt: "Ciarán",
|
|
|
|
title: "Ciarán Hanrahan",
|
|
|
|
},
|
|
|
|
];
|
|
|
|
|
|
|
|
export const Default = () => {
|
|
|
|
return (
|
|
|
|
<>
|
|
|
|
<AvatarGroup size="lg" items={IMAGES} />
|
|
|
|
</>
|
|
|
|
);
|
|
|
|
};
|