@flexis/ui
Version:
Styleless React Components
46 lines • 4.62 kB
JavaScript
import React from 'react';
import { action } from '@storybook/addon-actions';
import { text, boolean, select } from '@storybook/addon-knobs/react';
import { storiesOf, buildInfo } from '../../helpers/stories';
import { AlignSideValues } from '../common/types';
import Link from './';
const { TestIcon } = global;
export const stylableApi = `
Stylable API
---
- :withIcon
- :flexIcon
- ::iconContainer
- ::icon
${buildInfo([
{
values: AlignSideValues,
prefix: ':',
postfix: 'align',
indent: 1
}
])}
`;
export const events = {
onClick: action('click'),
onFocus: action('focus'),
onBlur: action('blur')
};
export default storiesOf('Link', module)
.addParameters({
info: stylableApi
})
.add('with text', () => (<Link {...events} href='#'>
{text('Label', 'Link')}
</Link>))
.add('with icon', () => (<Link {...events} href='#' icon={<TestIcon />} alignIcon={select('Align icon', AlignSideValues, 'left')}>
{text('Label', 'Link')}
</Link>))
.add('with icon only', () => (<Link {...events} href='#' icon={<TestIcon />} alignIcon={select('Align icon', AlignSideValues, 'left')}/>))
.add('with right aligned icon', () => (<Link {...events} href='#' icon={<TestIcon />} alignIcon={select('Align icon', AlignSideValues, 'right')}>
{text('Label', 'Link')}
</Link>))
.add('with flex icon', () => (<Link {...events} style={{ width: '100px' }} href='#' icon={<TestIcon />} alignIcon={select('Align icon', AlignSideValues, 'right')} flexIcon={boolean('Flex icon', true)}>
{text('Label', 'Link')}
</Link>));
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGluay5zdG9yaWVzLmpzeCIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0xpbmsvTGluay5zdG9yaWVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFDMUIsT0FBTyxFQUNOLE1BQU0sRUFDTixNQUFNLDBCQUEwQixDQUFDO0FBQ2xDLE9BQU8sRUFDTixJQUFJLEVBQ0osT0FBTyxFQUNQLE1BQU0sRUFDTixNQUFNLDhCQUE4QixDQUFDO0FBQ3RDLE9BQU8sRUFDTixTQUFTLEVBQ1QsU0FBUyxFQUNULE1BQU0sdUJBQXVCLENBQUM7QUFDL0IsT0FBTyxFQUNOLGVBQWUsRUFDZixNQUFNLGlCQUFpQixDQUFDO0FBQ3pCLE9BQU8sSUFBSSxNQUFNLElBQUksQ0FBQztBQUV0QixNQUFNLEVBQ0wsUUFBUSxFQUNSLEdBQUcsTUFBYSxDQUFDO0FBRWxCLE1BQU0sQ0FBQyxNQUFNLFdBQVcsR0FBRzs7Ozs7OztFQU96QixTQUFTLENBQUM7SUFDWDtRQUNDLE1BQU0sRUFBRyxlQUFlO1FBQ3hCLE1BQU0sRUFBRyxHQUFHO1FBQ1osT0FBTyxFQUFFLE9BQU87UUFDaEIsTUFBTSxFQUFHLENBQUM7S0FDVjtDQUNELENBQUM7Q0FDRCxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sTUFBTSxHQUFHO0lBQ3JCLE9BQU8sRUFBRSxNQUFNLENBQUMsT0FBTyxDQUFDO0lBQ3hCLE9BQU8sRUFBRSxNQUFNLENBQUMsT0FBTyxDQUFDO0lBQ3hCLE1BQU0sRUFBRyxNQUFNLENBQUMsTUFBTSxDQUFDO0NBQ3ZCLENBQUM7QUFFRixlQUFlLFNBQVMsQ0FBQyxNQUFNLEVBQUUsTUFBTSxDQUFDO0tBQ3RDLGFBQWEsQ0FBQztJQUNkLElBQUksRUFBRSxXQUFXO0NBQ2pCLENBQUM7S0FDRCxHQUFHLENBQ0gsV0FBVyxFQUNYLEdBQUcsRUFBRSxDQUFDLENBQ0wsQ0FBQyxJQUFJLENBQ0osSUFBSSxNQUFNLENBQUMsQ0FDWCxJQUFJLENBQUMsR0FBRyxDQUVSO0lBQUEsQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLE1BQU0sQ0FBQyxDQUN2QjtHQUFBLEVBQUUsSUFBSSxDQUFDLENBQ1AsQ0FDRDtLQUNBLEdBQUcsQ0FDSCxXQUFXLEVBQ1gsR0FBRyxFQUFFLENBQUMsQ0FDTCxDQUFDLElBQUksQ0FDSixJQUFJLE1BQU0sQ0FBQyxDQUNYLElBQUksQ0FBQyxHQUFHLENBQ1IsSUFBSSxDQUFDLENBQUMsQ0FBQyxRQUFRLENBQUEsRUFBRSxDQUFDLENBQ2xCLFNBQVMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxZQUFZLEVBQUUsZUFBZSxFQUFFLE1BQU0sQ0FBQyxDQUFDLENBRXpEO0lBQUEsQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLE1BQU0sQ0FBQyxDQUN2QjtHQUFBLEVBQUUsSUFBSSxDQUFDLENBQ1AsQ0FDRDtLQUNBLEdBQUcsQ0FDSCxnQkFBZ0IsRUFDaEIsR0FBRyxFQUFFLENBQUMsQ0FDTCxDQUFDLElBQUksQ0FDSixJQUFJLE1BQU0sQ0FBQyxDQUNYLElBQUksQ0FBQyxHQUFHLENBQ1IsSUFBSSxDQUFDLENBQUMsQ0FBQyxRQUFRLENBQUEsRUFBRSxDQUFDLENBQ2xCLFNBQVMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxZQUFZLEVBQUUsZUFBZSxFQUFFLE1BQU0sQ0FBQyxDQUFDLEVBQ3hELENBQ0YsQ0FDRDtLQUNBLEdBQUcsQ0FDSCx5QkFBeUIsRUFDekIsR0FBRyxFQUFFLENBQUMsQ0FDTCxDQUFDLElBQUksQ0FDSixJQUFJLE1BQU0sQ0FBQyxDQUNYLElBQUksQ0FBQyxHQUFHLENBQ1IsSUFBSSxDQUFDLENBQUMsQ0FBQyxRQUFRLENBQUEsRUFBRSxDQUFDLENBQ2xCLFNBQVMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxZQUFZLEVBQUUsZUFBZSxFQUFFLE9BQU8sQ0FBQyxDQUFDLENBRTFEO0lBQUEsQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLE1BQU0sQ0FBQyxDQUN2QjtHQUFBLEVBQUUsSUFBSSxDQUFDLENBQ1AsQ0FDRDtLQUNBLEdBQUcsQ0FDSCxnQkFBZ0IsRUFDaEIsR0FBRyxFQUFFLENBQUMsQ0FDTCxDQUFDLElBQUksQ0FDSixJQUFJLE1BQU0sQ0FBQyxDQUNYLEtBQUssQ0FBQyxDQUFDLEVBQUUsS0FBSyxFQUFFLE9BQU8sRUFBRSxDQUFDLENBQzFCLElBQUksQ0FBQyxHQUFHLENBQ1IsSUFBSSxDQUFDLENBQUMsQ0FBQyxRQUFRLENBQUEsRUFBRSxDQUFDLENBQ2xCLFNBQVMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxZQUFZLEVBQUUsZUFBZSxFQUFFLE9BQU8sQ0FBQyxDQUFDLENBQzFELFFBQVEsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxXQUFXLEVBQUUsSUFBSSxDQUFDLENBQUMsQ0FFckM7SUFBQSxDQUFDLElBQUksQ0FBQyxPQUFPLEVBQUUsTUFBTSxDQUFDLENBQ3ZCO0dBQUEsRUFBRSxJQUFJLENBQUMsQ0FDUCxDQUNELENBQUMifQ==