"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _react = require("@storybook/react");

var _react2 = _interopRequireDefault(require("react"));

var _ = require(".");

var _Box = require("../Box");

var _Button = require("../Button");

var _Form = require("../Form");

var _InputGroup = require("../InputGroup");

var _Stack = require("../Stack");

var __jsx = _react2["default"].createElement;
var stories = (0, _react.storiesOf)('Select', module);
stories.addDecorator(function (story) {
  return __jsx(_Box.Box, {
    maxWidth: "lg",
    mx: "auto",
    mt: 6,
    p: 6
  }, story());
});
var options = [{
  value: 'chocolate',
  label: 'Chocolate'
}, {
  value: 'strawberry',
  label: 'Strawberry'
}, {
  value: 'vanilla',
  label: 'Vanilla'
}];
stories.add('Default', function () {
  return __jsx(_.Select, {
    placeholder: "Select option",
    options: options,
    name: "select"
  });
});
stories.add('sizes', function () {
  return __jsx(_Box.Box, null, __jsx(_Stack.Stack, null, __jsx(_InputGroup.InputGroup, null, ['sm', 'md', 'lg'].map(function (size) {
    return __jsx(_.Select, {
      key: size,
      size: size,
      placeholder: "Placeholder",
      name: "size"
    });
  }))));
});
stories.add('Variations', function () {
  return __jsx(_Box.Box, null, __jsx(_Form.Form, {
    onSubmit: function onSubmit(e, _ref) {
      var getFormValue = _ref.getFormValue;
      e.preventDefault();
      console.log(getFormValue());
    }
  }, __jsx(_.Select, {
    options: options,
    name: "flavor1",
    placeholder: "Single",
    onChange: function onChange(v) {
      return console.log('custom', v);
    }
  }), __jsx(_.Select, {
    options: options,
    name: "flavor2",
    placeholder: "Multi",
    isMulti: true,
    onChange: function onChange(v) {
      return console.log('custom', v);
    }
  }), __jsx(_.Select, {
    options: options,
    name: "flavor4",
    placeholder: "Disabled",
    isDisabled: true,
    onChange: function onChange(v) {
      return console.log('custom', v);
    }
  }), __jsx(_.Select, {
    options: options,
    name: "flavor5",
    placeholder: "Createable",
    onChange: function onChange(v) {
      return console.log('custom', v);
    },
    onCreateOption: function onCreateOption(c) {
      return console.log('create', c);
    }
  }), __jsx(_.Select, {
    options: options,
    name: "flavor1",
    placeholder: "Full border",
    onChange: function onChange(v) {
      return console.log('custom', v);
    },
    border: "full"
  }), __jsx(_.Select, {
    options: options,
    name: "flavor1",
    placeholder: "Underlined",
    onChange: function onChange(v) {
      return console.log('custom', v);
    },
    border: "underline"
  }), __jsx(_.Select, {
    options: options,
    name: "flavor1",
    placeholder: "No border",
    onChange: function onChange(v) {
      return console.log('custom', v);
    },
    border: "unstyled"
  }), __jsx(_Button.Button, {
    type: "submit"
  }, "Submit")));
});
//# sourceMappingURL=examples.js.map