54 lines
1.5 KiB
TypeScript
54 lines
1.5 KiB
TypeScript
import { ComponentMeta } from "@storybook/react";
|
|
|
|
import { BaseCardProps, Card } from "@calcom/ui/v2/Card";
|
|
|
|
export default {
|
|
title: "Cards",
|
|
component: Card,
|
|
} as ComponentMeta<typeof Card>;
|
|
|
|
const profileProps: BaseCardProps[] = [
|
|
{
|
|
variant: "ProfileCard",
|
|
title: "Alex Fisher",
|
|
image:
|
|
"https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80",
|
|
description: "Co-founder at Attio. Book a meeting to discuss enterprise deals.",
|
|
},
|
|
{
|
|
variant: "ProfileCard",
|
|
title: "Julian Wan",
|
|
image:
|
|
"https://images.unsplash.com/photo-1570295999919-56ceb5ecca61?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1760&q=80",
|
|
description: "Co-founder at Attio. Book a meeting to discuss enterprise deals.",
|
|
},
|
|
];
|
|
|
|
export const Profile = () => {
|
|
return (
|
|
<div className="flex w-full space-x-2 bg-gray-200 p-4">
|
|
<Card {...profileProps[0]} />
|
|
<Card {...profileProps[1]} />
|
|
</div>
|
|
);
|
|
};
|
|
|
|
const appStoreProps: BaseCardProps = {
|
|
variant: "AppStore",
|
|
title: "Giphy",
|
|
image: "https://app.cal.com/api/app-store/giphy/icon.svg",
|
|
description: "Add GIFs to spice up your booking confirmations.",
|
|
actionButton: {
|
|
href: "#",
|
|
child: "View Details",
|
|
},
|
|
};
|
|
|
|
export const AppStore = () => {
|
|
return (
|
|
<div className="w-full bg-gray-200 p-4">
|
|
<Card {...appStoreProps} />
|
|
</div>
|
|
);
|
|
};
|