import React from 'react';

import {Link} from './Link';

// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
export default {
    component: Link,
    title:'Example/Link',
    // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
    argTypes: {
        backgroundColor: {control: 'color'},
    },
};

// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
// const Template = (args) => <table><QueueRow {...args} /></table>;
const Template = (args) => <div className="bg-gray-200 px-4 border-solid border-2 border-pink-600"><Link {...args} /></div>;

export const Undefined = Template.bind({});
Undefined.args = {
    text: undefined,
    url: undefined,
};

export const EmptyText = Template.bind({});
EmptyText.args = {
    text: '',
    url: 'https://sqs.eu-west-3.amazonaws.com/1234567890/main-queue',
};

export const NullText = Template.bind({});
NullText.args = {
    text: null,
    url: 'https://sqs.eu-west-3.amazonaws.com/1234567890/main-queue',
};

export const UndefinedText = Template.bind({});
UndefinedText.args = {
    text: undefined,
    url: 'https://sqs.eu-west-3.amazonaws.com/1234567890/main-queue',
};

export const NullURL = Template.bind({});
NullURL.args = {
    text: "some text, but no URL",
    url: null,
};
export const Normal = Template.bind({});
Normal.args = {
    text: 'some text',
    url: 'https://sqs.eu-west-3.amazonaws.com/1234567890/main-queue',
};