@flexis/ui/components/ImageSelect/ImageSelect.stories.es.js

Styleless React Components

import _extends from "@babel/runtime-corejs3/helpers/extends";
import React from 'react';
var _createElement = React.createElement;
import { action } from '@storybook/addon-actions';
import { select, text, boolean } from '@storybook/addon-knobs/react';
import { storiesOf, buildInfo } from '../../helpers/stories';
import ImageSelect, { DisplayValues } from './';
var _global = global,
    TestIcon = _global.TestIcon;
export var stylableApi = "\nStylable API\n- ::preview\n".concat(buildInfo([{
  values: DisplayValues,
  prefix: ':',
  indent: 1
}]), "\n- ::img\n- ::placeholder\n- ::resetButton\n\t- :hidden\n---\n");
export var events = {
  onChange: action('change')
}; // tslint:disable-next-line

export var imageUrl = 'https://instagram.fhen2-1.fna.fbcdn.net/vp/d81ca16ed081cd80553eaaa63fa24b34/5D69ED4D/t51.2885-15/e15/11274387_579453698862853_1466193977_n.jpg?_nc_ht=instagram.fhen2-1.fna.fbcdn.net';
var style = {
  backgroundSize: 'cover',
  minWidth: '4em',
  minHeight: '4em'
};

var _ref = /*#__PURE__*/_createElement(TestIcon, null);

export default storiesOf('ImageSelect', module).addParameters({
  info: stylableApi
}).add('with default state', function () {
  return _createElement(ImageSelect, _extends({}, events, {
    previewStyle: style,
    display: select('Display', DisplayValues, 'block')
  }));
}).add('with placeholder', function () {
  return _createElement(ImageSelect, _extends({}, events, {
    previewStyle: style,
    display: select('Display', DisplayValues, 'block'),
    placeholder: _ref
  }));
}).add('with value', function () {
  return _createElement(ImageSelect, _extends({}, events, {
    previewStyle: style,
    display: select('Display', DisplayValues, 'block'),
    value: text('Value', imageUrl)
  }));
}).add('with default value', function () {
  return _createElement(ImageSelect, _extends({}, events, {
    previewStyle: style,
    display: select('Display', DisplayValues, 'block'),
    defaultValue: text('Default value', imageUrl)
  }));
}).add('with disabled state', function () {
  return _createElement(ImageSelect, _extends({}, events, {
    previewStyle: style,
    defaultValue: text('Default value', imageUrl),
    disabled: boolean('Disabled', true)
  }));
}).add('with readOnly state', function () {
  return _createElement(ImageSelect, _extends({}, events, {
    previewStyle: style,
    defaultValue: text('Default value', imageUrl),
    readOnly: boolean('Readonly', true)
  }));
}).add('with title', function () {
  return _createElement(ImageSelect, _extends({}, events, {
    previewStyle: style,
    title: text('Title', 'Select image')
  }));
});
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0ltYWdlU2VsZWN0L0ltYWdlU2VsZWN0LnN0b3JpZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQVAsTUFBa0IsT0FBbEI7O0FBQ0EsU0FDQyxNQURELFFBRU8sMEJBRlA7QUFHQSxTQUNDLE1BREQsRUFFQyxJQUZELEVBR0MsT0FIRCxRQUlPLDhCQUpQO0FBS0EsU0FDQyxTQURELEVBRUMsU0FGRCxRQUdPLHVCQUhQO0FBSUEsT0FBTyxXQUFQLElBQ0MsYUFERCxRQUVPLElBRlA7Y0FNSSxNO0lBREgsUSxXQUFBLFE7QUFHRCxPQUFPLElBQU0sV0FBVywwQ0FHdEIsU0FBUyxDQUFDLENBQ1g7QUFDQyxFQUFBLE1BQU0sRUFBRSxhQURUO0FBRUMsRUFBQSxNQUFNLEVBQUUsR0FGVDtBQUdDLEVBQUEsTUFBTSxFQUFFO0FBSFQsQ0FEVyxDQUFELENBSGEsb0VBQWpCO0FBaUJQLE9BQU8sSUFBTSxNQUFNLEdBQUc7QUFDckIsRUFBQSxRQUFRLEVBQUUsTUFBTSxDQUFDLFFBQUQ7QUFESyxDQUFmLEMsQ0FJUDs7QUFDQSxPQUFPLElBQU0sUUFBUSxHQUFHLHVMQUFqQjtBQUVQLElBQU0sS0FBSyxHQUFHO0FBQ2IsRUFBQSxjQUFjLEVBQUUsT0FESDtBQUViLEVBQUEsUUFBUSxFQUFRLEtBRkg7QUFHYixFQUFBLFNBQVMsRUFBTztBQUhILENBQWQ7O3dCQTJCaUIsZUFBQyxRQUFELE87O0FBckJqQixlQUFlLFNBQVMsQ0FBQyxhQUFELEVBQWdCLE1BQWhCLENBQVQsQ0FDYixhQURhLENBQ0M7QUFDZCxFQUFBLElBQUksRUFBRTtBQURRLENBREQsRUFJYixHQUphLENBS2Isb0JBTGEsRUFNYjtBQUFBLFNBQ0MsZUFBQyxXQUFELGVBQ0ssTUFETDtBQUVDLElBQUEsWUFBWSxFQUFFLEtBRmY7QUFHQyxJQUFBLE9BQU8sRUFBRSxNQUFNLENBQUMsU0FBRCxFQUFZLGFBQVosRUFBMkIsT0FBM0I7QUFIaEIsS0FERDtBQUFBLENBTmEsRUFjYixHQWRhLENBZWIsa0JBZmEsRUFnQmI7QUFBQSxTQUNDLGVBQUMsV0FBRCxlQUNLLE1BREw7QUFFQyxJQUFBLFlBQVksRUFBRSxLQUZmO0FBR0MsSUFBQSxPQUFPLEVBQUUsTUFBTSxDQUFDLFNBQUQsRUFBWSxhQUFaLEVBQTJCLE9BQTNCLENBSGhCO0FBSUMsSUFBQSxXQUFXO0FBSlosS0FERDtBQUFBLENBaEJhLEVBeUJiLEdBekJhLENBMEJiLFlBMUJhLEVBMkJiO0FBQUEsU0FDQyxlQUFDLFdBQUQsZUFDSyxNQURMO0FBRUMsSUFBQSxZQUFZLEVBQUUsS0FGZjtBQUdDLElBQUEsT0FBTyxFQUFFLE1BQU0sQ0FBQyxTQUFELEVBQVksYUFBWixFQUEyQixPQUEzQixDQUhoQjtBQUlDLElBQUEsS0FBSyxFQUFFLElBQUksQ0FBQyxPQUFELEVBQVUsUUFBVjtBQUpaLEtBREQ7QUFBQSxDQTNCYSxFQW9DYixHQXBDYSxDQXFDYixvQkFyQ2EsRUFzQ2I7QUFBQSxTQUNDLGVBQUMsV0FBRCxlQUNLLE1BREw7QUFFQyxJQUFBLFlBQVksRUFBRSxLQUZmO0FBR0MsSUFBQSxPQUFPLEVBQUUsTUFBTSxDQUFDLFNBQUQsRUFBWSxhQUFaLEVBQTJCLE9BQTNCLENBSGhCO0FBSUMsSUFBQSxZQUFZLEVBQUUsSUFBSSxDQUFDLGVBQUQsRUFBa0IsUUFBbEI7QUFKbkIsS0FERDtBQUFBLENBdENhLEVBK0NiLEdBL0NhLENBZ0RiLHFCQWhEYSxFQWlEYjtBQUFBLFNBQ0MsZUFBQyxXQUFELGVBQ0ssTUFETDtBQUVDLElBQUEsWUFBWSxFQUFFLEtBRmY7QUFHQyxJQUFBLFlBQVksRUFBRSxJQUFJLENBQUMsZUFBRCxFQUFrQixRQUFsQixDQUhuQjtBQUlDLElBQUEsUUFBUSxFQUFFLE9BQU8sQ0FBQyxVQUFELEVBQWEsSUFBYjtBQUpsQixLQUREO0FBQUEsQ0FqRGEsRUEwRGIsR0ExRGEsQ0EyRGIscUJBM0RhLEVBNERiO0FBQUEsU0FDQyxlQUFDLFdBQUQsZUFDSyxNQURMO0FBRUMsSUFBQSxZQUFZLEVBQUUsS0FGZjtBQUdDLElBQUEsWUFBWSxFQUFFLElBQUksQ0FBQyxlQUFELEVBQWtCLFFBQWxCLENBSG5CO0FBSUMsSUFBQSxRQUFRLEVBQUUsT0FBTyxDQUFDLFVBQUQsRUFBYSxJQUFiO0FBSmxCLEtBREQ7QUFBQSxDQTVEYSxFQXFFYixHQXJFYSxDQXNFYixZQXRFYSxFQXVFYjtBQUFBLFNBQ0MsZUFBQyxXQUFELGVBQ0ssTUFETDtBQUVDLElBQUEsWUFBWSxFQUFFLEtBRmY7QUFHQyxJQUFBLEtBQUssRUFBRSxJQUFJLENBQUMsT0FBRCxFQUFVLGNBQVY7QUFIWixLQUREO0FBQUEsQ0F2RWEsQ0FBZiIsInNvdXJjZVJvb3QiOiIifQ==