'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _styledComponents = require('styled-components');

var _styledComponents2 = _interopRequireDefault(_styledComponents);

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

var FormColumn = _styledComponents2.default.section.withConfig({
  displayName: 'FormColumn__FormColumn'
})(['padding: 0 ', ';border-right: ', ';&:first-of-type {padding-left: 0;}&:last-of-type {border-right: none;padding-right: 0;}'], function (_ref) {
  var theme = _ref.theme;
  return theme.padding.large;
}, function (_ref2) {
  var theme = _ref2.theme;
  return theme.formColumn.border;
});

FormColumn.usage = '\n# FormColumn\n\nSometimes forms are split into vertical columns. Very rarely, but we still have a component for that.\n\n```\n<Form>\n  <FormColumn>\n    <Field component={Foo} />\n    <FieldGroup> ... </FieldGroup>\n  </FormColumn>\n  <FormColumn>\n    <Field component={Bar} />\n    <FieldGroup> ... </FieldGroup>\n  </FormColumn>\n</Form>\n```\n';

exports.default = FormColumn;