import React from 'react';
import { storiesOf } from '@storybook/react';
import { withKnobs, text as _text, boolean } from '@storybook/addon-knobs';
import DecorativeLink from './index';
import DecorativeLinkDocs from './DecorativeLink.md';
import Icon from '../../../base/Icon';

export default {
  info: function info(value) {
    return _text('DecorativeLink: info', value, 'DecorativeLink');
  },
  text: function text(value) {
    return _text('DecorativeLink: linkText', value, 'DecorativeLink');
  },
  href: function href(value) {
    return _text('DecorativeLink: href', value, 'DecorativeLink');
  },
  showFileIcon: function showFileIcon(value) {
    return boolean('DecorativeLink: showFileIcon', value, 'DecorativeLink');
  }
};

storiesOf('atoms/links', module).addDecorator(withKnobs({ escapeHTML: false })).add('DecorativeLink', function () {
  var props = {
    info: _text('DecorativeLink: info', 'This is a clickable styled link', 'DecorativeLink'),
    text: _text('DecorativeLink: text', 'HTML Page as a Link', 'DecorativeLink'),
    href: _text('DecorativeLink: href', '#', 'DecorativeLink'),
    showFileIcon: boolean('DecorativeLink: showFileIcon', false, 'DecorativeLink')
  };
  var fileProps = {
    info: _text('DecorativeLink as File: info', 'This is a clickable styled link', 'DecorativeLink as File'),
    text: _text('DecorativeLink as File: text', 'File as a Link', 'DecorativeLink as File'),
    href: _text('DecorativeLink as File: href', 'https://www.mass.gov/test.pdf', 'DecorativeLink as File'),
    showFileIcon: boolean('DecorativeLink as File: showFileIcon', true, 'DecorativeLink as File')
  };
  var fileDlProps = {
    info: _text('DecorativeLink as File Dl: info', 'This is a clickable styled link', 'DecorativeLink as File Download'),
    text: _text('DecorativeLink as File Dl: text', 'File Download as a Link', 'DecorativeLink as File Download'),
    href: _text('DecorativeLink as File Dl: href', 'https://www.mass.gov/test.pdf', 'DecorativeLink as File Download'),
    details: _text('DecorativeLink as File Dl: details', '(30 MB)', 'DecorativeLink as File Download'),
    showFileIcon: boolean('DecorativeLink as as File Dl: showFileIcon', true, 'DecorativeLink as File'),
    icon: React.createElement(Icon, { name: 'download', svgWidth: 15, svgHeight: 15 })
  };
  return React.createElement(
    React.Fragment,
    null,
    React.createElement(DecorativeLink, props),
    React.createElement('hr', null),
    React.createElement(DecorativeLink, fileProps),
    React.createElement('hr', null),
    React.createElement(DecorativeLink, fileDlProps)
  );
}, { info: DecorativeLinkDocs });