'use strict';

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

var _reactStyledSystem = require('@patternfly/react-styled-system');

var _SpaceStyles = require('./examples/SpaceStyles');

var _SpaceStyles2 = _interopRequireDefault(_SpaceStyles);

var _ResponsiveStyles = require('./examples/ResponsiveStyles');

var _ResponsiveStyles2 = _interopRequireDefault(_ResponsiveStyles);

var _FlexStyles = require('./examples/FlexStyles');

var _FlexStyles2 = _interopRequireDefault(_FlexStyles);

var _WidthStyles = require('./examples/WidthStyles');

var _WidthStyles2 = _interopRequireDefault(_WidthStyles);

var _FontSizeStyles = require('./examples/FontSizeStyles');

var _FontSizeStyles2 = _interopRequireDefault(_FontSizeStyles);

var _ColorStyles = require('./examples/ColorStyles');

var _ColorStyles2 = _interopRequireDefault(_ColorStyles);

var _TypographyStyles = require('./examples/TypographyStyles');

var _TypographyStyles2 = _interopRequireDefault(_TypographyStyles);

var _BorderStyles = require('./examples/BorderStyles');

var _BorderStyles2 = _interopRequireDefault(_BorderStyles);

var _BoxShadowStyles = require('./examples/BoxShadowStyles');

var _BoxShadowStyles2 = _interopRequireDefault(_BoxShadowStyles);

var _PositionStyles = require('./examples/PositionStyles');

var _PositionStyles2 = _interopRequireDefault(_PositionStyles);

var _OverrideTheme = require('./examples/OverrideTheme');

var _OverrideTheme2 = _interopRequireDefault(_OverrideTheme);

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

exports.default = {
  title: 'StyledSystem',
  components: {
    PatternFlyThemeProvider: _reactStyledSystem.PatternFlyThemeProvider,
    StyledBox: _reactStyledSystem.StyledBox,
    StyledFlex: _reactStyledSystem.StyledFlex,
    StyledText: _reactStyledSystem.StyledText
  },
  examples: [{
    component: _SpaceStyles2.default,
    title: 'Space',
    description: '\n    <em>The space utility converts shorthand margin and padding props to margin and padding CSS declarations.<br />\n    Use StyledConstants.space with margin and padding props<br />\n    Negative values from StyledConstants.space (neg_*) can be used for negative margins.<br />\n    String values are passed as raw CSS values.<br />\n    Array values are converted into responsive values.</em>\n    '
  }, {
    component: _WidthStyles2.default,
    title: 'Width',
    description: '\n    <em>Numbers from 0-1 are converted to percentage widths.<br />\n    Numbers greater than 1 are converted to pixel values.<br />\n    String values are passed as raw CSS values.<br />\n    Array values are converted into responsive width styles.<br /></em>\n    '
  }, {
    component: _ResponsiveStyles2.default,
    title: 'Responsive',
    description: '<em>All props accept arrays as values for responsive styling. You can specify up to 4 array values for each of the breakpoints.</em>'
  }, { component: _FlexStyles2.default, title: 'Flex' }, {
    component: _FontSizeStyles2.default,
    title: 'Font Size',
    description: '\n      <em>Use StyledConstants.fontSizes to set a size.<br />\n      Array values are converted into responsive values.</em>\n    '
  }, {
    component: _ColorStyles2.default,
    title: 'Colors',
    description: '\n      <em>Use color or bg (background) props with StyledConstants.colors to set a color.<br />\n      Array values are converted into responsive values.</em>\n    '
  }, { component: _TypographyStyles2.default, title: 'Typography' }, { component: _BorderStyles2.default, title: 'Borders' }, { component: _BoxShadowStyles2.default, title: 'Box Shadow' }, { component: _PositionStyles2.default, title: 'Position' }, {
    component: _OverrideTheme2.default,
    title: 'Override Theme',
    description: '\n    <em><p>You can override the theme by supplying a theme object.</p>\n    <p>If multiple PatternFlyThemeProviders are nested, the theme object of the lower provider will be merged into the ancestor theme.</p></em>'
  }],
  description: '\n    <strong>Warning, the StyledSystem components are experimental and in their own package @patternfly/react-styled-system. Use at your own risk!</strong><br />\n    The PatternFlyThemeProvider component maps CSS to PatternFly global values that can be used with StyledBox, StyledFlex, and StyledText components.<br />\n    The StyledFlex and StyledText components inherit all the props from StyledBox in addition to their own props.<br />\n    To apply the PatternFly theme, use <PatternFlyThemeProvider> at the root of your application.'
};