wix-style-react/dist/stories/Notification/index.story.js

wix-style-react

'use strict';

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

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _Sections = require('wix-storybook-utils/Sections');

var _Notification = require('wix-style-react/Notification');

var _Notification2 = _interopRequireDefault(_Notification);

var _Text = require('wix-style-react/Text');

var _Text2 = _interopRequireDefault(_Text);

var _examples = require('./examples.js');

var examples = _interopRequireWildcard(_examples);

var _README = require('../../src/Notification/README.md');

var _README2 = _interopRequireDefault(_README);

var _typesReadme = require('./types.readme.md');

var _typesReadme2 = _interopRequireDefault(_typesReadme);

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }

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

var exampleChildren = [{
  label: 'Just text',
  value: [_react2.default.createElement(
    _Notification2.default.TextLabel,
    null,
    'Notification text'
  ), _react2.default.createElement(_Notification2.default.CloseButton, null)]
}, {
  label: 'Text and button',
  value: [_react2.default.createElement(
    _Notification2.default.TextLabel,
    null,
    'Notification text'
  ), _react2.default.createElement(
    _Notification2.default.ActionButton,
    null,
    'Button'
  ), _react2.default.createElement(_Notification2.default.CloseButton, null)]
}];

exports.default = {
  category: '8. Notification Bars',
  storyName: '8.1 Notification',
  component: _Notification2.default,
  componentPath: '../../src/Notification',

  componentProps: {
    theme: 'standard',
    type: 'global',
    show: true,
    children: exampleChildren[0].value
  },

  componentWrapper: function componentWrapper(_ref) {
    var component = _ref.component;
    return _react2.default.createElement(
      'div',
      null,
      component,
      _react2.default.createElement(
        _Text2.default,
        null,
        'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.'.repeat(5)
      )
    );
  },
  exampleProps: {
    children: exampleChildren
  },

  sections: [(0, _Sections.tab)({
    title: 'Description',
    sections: [(0, _Sections.description)({
      text: 'A sticky toast bar that appears on top of the screen notifying about system changes.'
    }), (0, _Sections.importExample)({
      source: "import Notification from 'wix-style-react/Notification';"
    }), (0, _Sections.description)({
      text: _README2.default
    }), (0, _Sections.description)({
      title: 'Examples'
    }), (0, _Sections.liveCode)({
      title: 'Themes',
      compact: true,
      source: examples.themes,
      components: { Notification: _Notification2.default }
    }), (0, _Sections.liveCode)({
      title: 'Actions',
      compact: true,
      source: examples.actions,
      components: { Notification: _Notification2.default }
    }), (0, _Sections.description)({
      title: 'Ways to display Notification',
      text: _typesReadme2.default
    })]
  }), (0, _Sections.tab)({
    title: 'Playground',
    sections: [(0, _Sections.playground)()]
  }), (0, _Sections.tab)({
    title: 'API',
    sections: [(0, _Sections.api)()]
  }), (0, _Sections.tab)({
    title: 'Testkit',
    sections: [(0, _Sections.testkit)()]
  })]
};