wix-style-react/dist/stories/DatePicker.story.js

wix-style-react

'use strict';

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

var _DatePicker = require('wix-style-react/DatePicker');

var _DatePicker2 = _interopRequireDefault(_DatePicker);

var _format = require('date-fns/format');

var _format2 = _interopRequireDefault(_format);

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

var defaultValue = new Date('2017/05/01');
var today = new Date();
var tomorrow = new Date();
tomorrow.setDate(today.getDate() + 1);

exports.default = {
  category: '3. Inputs',
  storyName: '3.6 DatePicker',
  component: _DatePicker2.default,
  componentPath: '../src/DatePicker',

  componentProps: function componentProps(setState) {
    return {
      onChange: function onChange(value) {
        return setState({ value: value });
      },
      dateFormat: 'YYYY/MM/DD',
      dataHook: 'storybook-datepicker',
      placeholderText: 'Select Date',
      value: defaultValue,
      shouldCloseOnSelect: true,
      showYearDropdown: false,
      showMonthDropdown: false,
      locale: 'en',
      twoMonths: false
    };
  },

  exampleProps: {
    onChange: function onChange(date) {
      return (0, _format2.default)(date, 'YYYY/MM/DD');
    },
    value: [{ label: '2017/05/01', value: defaultValue }, { label: 'Today', value: today }, { label: 'Tomorrow', value: tomorrow }],
    dateFormat: [{ label: 'YYYY/MM/DD', value: 'YYYY/MM/DD' }, { label: 'MM/DD/YYYY', value: 'MM/DD/YYYY' }, {
      label: 'custom function (date.getDate())',
      value: function value(date) {
        return date.getDate();
      }
    }]
  }
};