import { action } from '@storybook/addon-actions';
import { registerIcon, Flex, Link, Image } from '@pega/cosmos-react-core';
import * as plusIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/plus.icon';
registerIcon(plusIcon);
export default {
    title: 'Core/Link',
    component: Link,
    args: {
        variant: 'link'
    },
    argTypes: {
        variant: {
            options: ['link', 'primary', 'secondary', 'simple', 'text'],
            control: { type: 'select' }
        }
    }
};
export const LinkDemo = (args) => {
    return (<Link href='/' variant={args.variant}>
      Link text
    </Link>);
};
export const ExternalLinkDemo = (args) => {
    return (<Link href='http://www.pega.com' variant={args.variant}>
      Visit Pega!
    </Link>);
};
export const ImageLinkDemo = (args) => {
    return (<Link href='http://www.pega.com' variant={args.variant}>
      <Image src='https://upload.wikimedia.org/wikipedia/commons/thumb/9/91/Download_on_the_App_Store_RGB_blk.svg/320px-Download_on_the_App_Store_RGB_blk.svg.png' alt='Pega'/>
    </Link>);
};
export const PreviewableLink = (args) => {
    return (<Link href='#ID-123456' variant={args.variant} previewable onPreview={args.onPreview || action('Preview activated')}>
      ID-123456
    </Link>);
};
export const MultiplePreviewableLinks = (args) => {
    return (<Flex container={{ gap: 2 }}>
      <Link href='#ID-123456' variant={args.variant} previewable onPreview={args.onPreview || action('Preview activated')}>
        ID-123456
      </Link>
      <Link href='#ID-ABCDEF' variant={args.variant} previewable onPreview={args.onPreview || action('Preview activated')}>
        ID-ABCDEF
      </Link>
    </Flex>);
};
//# sourceMappingURL=Link.stories.jsx.map