'use strict';

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _react3 = require('@storybook/react');

var _addonKnobs = require('@storybook/addon-knobs');

var _index = require('./index');

var _index2 = _interopRequireDefault(_index);

var _Image = require('./Image.md');

var _Image2 = _interopRequireDefault(_Image);

var _x = require('../../../../assets/images/placeholder/800x400.png');

var _x2 = _interopRequireDefault(_x);

var _x3 = require('../../../../assets/images/placeholder/250x250.png');

var _x4 = _interopRequireDefault(_x3);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

(0, _react3.storiesOf)('atoms/media', module).addDecorator((0, _addonKnobs.withKnobs)({ escapeHTML: false })).add('Image', function () {
  var props = {
    alt: (0, _addonKnobs.text)('alt', 'alt text'),
    src: (0, _addonKnobs.text)('src', _x2.default),
    width: (0, _addonKnobs.number)('width', 800),
    height: (0, _addonKnobs.number)('height', 400),
    shape: (0, _addonKnobs.text)('shape', ''),
    classes: (0, _addonKnobs.array)('classes', [])
  };
  return _react2.default.createElement(_index2.default, props);
}, { info: _Image2.default }).add('Image (circular)', function () {
  var props = {
    alt: (0, _addonKnobs.text)('alt', 'alt text'),
    src: (0, _addonKnobs.text)('src', _x4.default),
    width: (0, _addonKnobs.number)('width', 250),
    height: (0, _addonKnobs.number)('height', 250),
    shape: (0, _addonKnobs.text)('shape', 'circular'),
    classes: (0, _addonKnobs.array)('classes', [])
  };

  return _react2.default.createElement(_index2.default, props);
}, { info: _Image2.default });