import * as React from 'react';
import { TestImages } from '@fluentui/example-data';
import { Image, ImageFit, Persona, PersonaPresence, Stack, Text } from '@fluentui/react';
import { DefaultButton, IconButton } from '@fluentui/react/lib/Button';
import { Card, CardBody, CardFooter, CardHeader } from '@fluentui/react-cards';
function onClick() {
    alert('Card was clicked');
}
var stackTokens = {
    maxWidth: 300,
};
export var TeamsCards = function () { return (React.createElement(Stack, { gap: 40, tokens: stackTokens },
    React.createElement("div", null,
        React.createElement(Text, { variant: "xLarge" }, "Basic Card"),
        React.createElement(Card, { onClick: onClick },
            React.createElement(CardHeader, null,
                React.createElement(Persona, { imageUrl: TestImages.personaMale, text: "Carmen Gaylord", secondaryText: "Direct Communications Agent", presence: PersonaPresence.offline })),
            React.createElement(CardBody, null, "Voluptatibus commodi ut. Neque eum odit eius repellat molestiae illo aut ut illum. Nulla vel et odit consequatur dolorem molestias. Rem rerum animi consequatur."))),
    React.createElement("div", null,
        React.createElement(Text, { variant: "xLarge" }, "Only header"),
        React.createElement(Card, { onClick: onClick },
            React.createElement(CardHeader, { fitted: true },
                React.createElement(Persona, { imageUrl: TestImages.personaMale, text: "Carmen Gaylord", secondaryText: "Direct Communications Agent", presence: PersonaPresence.offline })))),
    React.createElement("div", null,
        React.createElement(Text, { variant: "xLarge" }, "Only body"),
        React.createElement(Card, { onClick: onClick },
            React.createElement(CardBody, { fitted: true },
                React.createElement(Stack, { gap: 10 },
                    React.createElement(Image, { src: "http://via.placeholder.com/500x500", imageFit: ImageFit.cover, height: 300, maximizeFrame: true }),
                    React.createElement(Text, null, "Citizens of distant epochs muse about at theedge of forever hearts of the..."))))),
    React.createElement("div", null,
        React.createElement(Text, { variant: "xLarge" }, "Only footer"),
        React.createElement(Card, { onClick: onClick },
            React.createElement(CardFooter, { fitted: true },
                React.createElement(Stack, { horizontal: true, horizontalAlign: "space-between" },
                    React.createElement(DefaultButton, { text: "Action" }),
                    React.createElement(Stack, { horizontal: true },
                        React.createElement(IconButton, { iconProps: { iconName: 'FavoriteStar' } }),
                        React.createElement(IconButton, { iconProps: { iconName: 'Download' } }),
                        React.createElement(IconButton, { iconProps: { iconName: 'More' } })))))))); };
//# sourceMappingURL=Card.Teams.stories.js.map