wix-style-react/dist/stories/StatsWidget/index.js

wix-style-react

'use strict';

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

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

var _AutoDocs = require('wix-storybook-utils/AutoDocs');

var _AutoDocs2 = _interopRequireDefault(_AutoDocs);

var _TabbedView = require('wix-storybook-utils/TabbedView');

var _TabbedView2 = _interopRequireDefault(_TabbedView);

var _Markdown = require('wix-storybook-utils/Markdown');

var _Markdown2 = _interopRequireDefault(_Markdown);

var _CodeExample = require('wix-storybook-utils/CodeExample');

var _CodeExample2 = _interopRequireDefault(_CodeExample);

var _StatsWidget = require('!raw-loader!../../src/StatsWidget/StatsWidget');

var _StatsWidget2 = _interopRequireDefault(_StatsWidget);

var _ExampleStatsWidgetStandard = require('./ExampleStatsWidgetStandard');

var _ExampleStatsWidgetStandard2 = _interopRequireDefault(_ExampleStatsWidgetStandard);

var _ExampleStatsWidgetStandard3 = require('!raw-loader!./ExampleStatsWidgetStandard');

var _ExampleStatsWidgetStandard4 = _interopRequireDefault(_ExampleStatsWidgetStandard3);

var _ExampleStatsWidgetWithPercents = require('./ExampleStatsWidgetWithPercents');

var _ExampleStatsWidgetWithPercents2 = _interopRequireDefault(_ExampleStatsWidgetWithPercents);

var _ExampleStatsWidgetWithPercents3 = require('!raw-loader!./ExampleStatsWidgetWithPercents');

var _ExampleStatsWidgetWithPercents4 = _interopRequireDefault(_ExampleStatsWidgetWithPercents3);

var _ExampleStatsWidgetWithInvertPercentColor = require('./ExampleStatsWidgetWithInvertPercentColor');

var _ExampleStatsWidgetWithInvertPercentColor2 = _interopRequireDefault(_ExampleStatsWidgetWithInvertPercentColor);

var _ExampleStatsWidgetWithInvertPercentColor3 = require('!raw-loader!./ExampleStatsWidgetWithInvertPercentColor');

var _ExampleStatsWidgetWithInvertPercentColor4 = _interopRequireDefault(_ExampleStatsWidgetWithInvertPercentColor3);

var _ExampleStatsWidgetWithFilters = require('./ExampleStatsWidgetWithFilters');

var _ExampleStatsWidgetWithFilters2 = _interopRequireDefault(_ExampleStatsWidgetWithFilters);

var _ExampleStatsWidgetWithFilters3 = require('!raw-loader!./ExampleStatsWidgetWithFilters');

var _ExampleStatsWidgetWithFilters4 = _interopRequireDefault(_ExampleStatsWidgetWithFilters3);

var _ExampleStatsWidgetEmptyState = require('./ExampleStatsWidgetEmptyState');

var _ExampleStatsWidgetEmptyState2 = _interopRequireDefault(_ExampleStatsWidgetEmptyState);

var _ExampleStatsWidgetEmptyState3 = require('!raw-loader!./ExampleStatsWidgetEmptyState');

var _ExampleStatsWidgetEmptyState4 = _interopRequireDefault(_ExampleStatsWidgetEmptyState3);

var _ExampleStatsWidgetWithFilterWithNoBorder = require('./ExampleStatsWidgetWithFilterWithNoBorder');

var _ExampleStatsWidgetWithFilterWithNoBorder2 = _interopRequireDefault(_ExampleStatsWidgetWithFilterWithNoBorder);

var _ExampleStatsWidgetWithFilterWithNoBorder3 = require('!raw-loader!./ExampleStatsWidgetWithFilterWithNoBorder');

var _ExampleStatsWidgetWithFilterWithNoBorder4 = _interopRequireDefault(_ExampleStatsWidgetWithFilterWithNoBorder3);

var _READMETESTKIT = require('../../src/StatsWidget/README.TESTKIT.md');

var _READMETESTKIT2 = _interopRequireDefault(_READMETESTKIT);

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

(0, _react3.storiesOf)('2. Layout', module).add('2.7 StatsWidget', function () {
  return _react2.default.createElement(
    _TabbedView2.default,
    { tabs: ['Usage', 'Testkit'] },
    _react2.default.createElement(
      'div',
      null,
      _react2.default.createElement(_AutoDocs2.default, { source: _StatsWidget2.default }),
      _react2.default.createElement(
        'h1',
        null,
        'Usage examples'
      ),
      _react2.default.createElement(
        _CodeExample2.default,
        { title: 'Stats widget', code: _ExampleStatsWidgetStandard4.default },
        _react2.default.createElement(_ExampleStatsWidgetStandard2.default, null)
      ),
      _react2.default.createElement(
        _CodeExample2.default,
        {
          title: 'Stats widget example with percents',
          code: _ExampleStatsWidgetWithPercents4.default
        },
        _react2.default.createElement(_ExampleStatsWidgetWithPercents2.default, null)
      ),
      _react2.default.createElement(
        _CodeExample2.default,
        {
          title: 'Stats widget example with invert percent color',
          code: _ExampleStatsWidgetWithInvertPercentColor4.default
        },
        _react2.default.createElement(_ExampleStatsWidgetWithInvertPercentColor2.default, null)
      ),
      _react2.default.createElement(
        _CodeExample2.default,
        {
          title: 'Stats widget example with filter',
          code: _ExampleStatsWidgetWithFilterWithNoBorder4.default
        },
        _react2.default.createElement(_ExampleStatsWidgetWithFilterWithNoBorder2.default, null)
      ),
      _react2.default.createElement(
        _CodeExample2.default,
        {
          title: 'Stats widget example with multiple filters',
          code: _ExampleStatsWidgetWithFilters4.default
        },
        _react2.default.createElement(_ExampleStatsWidgetWithFilters2.default, null)
      ),
      _react2.default.createElement(
        _CodeExample2.default,
        {
          title: 'Stats widget example with empty state',
          code: _ExampleStatsWidgetEmptyState4.default
        },
        _react2.default.createElement(_ExampleStatsWidgetEmptyState2.default, null)
      )
    ),
    _react2.default.createElement(_Markdown2.default, { source: _READMETESTKIT2.default })
  );
});