web: components: Moved story for DatePicker + added base test
This commit is contained in:
parent
7d88c9b3d2
commit
af6a70c82c
@ -20,7 +20,7 @@ const arraySize = ['base', 'big'];
|
|||||||
storiesOf('Components|Calendar', module)
|
storiesOf('Components|Calendar', module)
|
||||||
.addDecorator(withKnobs)
|
.addDecorator(withKnobs)
|
||||||
.addDecorator(withReadme(Readme))
|
.addDecorator(withReadme(Readme))
|
||||||
.add('calendar', () => (
|
.add('base', () => (
|
||||||
<NewCalendar
|
<NewCalendar
|
||||||
onChange={date => {
|
onChange={date => {
|
||||||
action('Selected date')(date);
|
action('Selected date')(date);
|
||||||
|
@ -1,27 +1,22 @@
|
|||||||
# Calendar
|
# DatePicker
|
||||||
|
|
||||||
#### Description
|
#### Description
|
||||||
|
|
||||||
Custom calendar
|
DatePicker
|
||||||
|
|
||||||
#### Usage
|
#### Usage
|
||||||
|
|
||||||
```js
|
```js
|
||||||
import { NewCalendar } from 'asc-web-components';
|
import { DatePicker } from 'asc-web-components';
|
||||||
|
|
||||||
<NewCalendar
|
<DatePicker
|
||||||
onChange={date => {
|
onChange={date => {
|
||||||
action('Selected date')(date);
|
console.log('Selected date', date);
|
||||||
}}
|
}}
|
||||||
disabled={boolean('disabled', false)}
|
selectedDate={new Date()}
|
||||||
themeColor={color('themeColor', '#ED7309')}
|
minDate={new Date("1970/01/01")}
|
||||||
selectedDate={myDateKnob('selectedDate', new Date())}
|
maxDate={new Date(new Date().getFullYear() + 1 + "/01/01")}
|
||||||
openToDate={myDateKnob('openToDate', new Date())}
|
/>
|
||||||
minDate={myDateKnob('minDate', new Date("1970/01/01"))}
|
|
||||||
maxDate={myDateKnob('maxDate', new Date("3000/01/01"))}
|
|
||||||
locale={select('location', locales, 'en')}
|
|
||||||
scaled = {boolean('scaled', false)}
|
|
||||||
/>
|
|
||||||
```
|
```
|
||||||
|
|
||||||
#### Properties
|
#### Properties
|
@ -4,8 +4,8 @@ import { action } from '@storybook/addon-actions';
|
|||||||
import { withKnobs, boolean, color, select, date } from '@storybook/addon-knobs/react';
|
import { withKnobs, boolean, color, select, date } from '@storybook/addon-knobs/react';
|
||||||
import withReadme from 'storybook-readme/with-readme';
|
import withReadme from 'storybook-readme/with-readme';
|
||||||
import Readme from './README.md';
|
import Readme from './README.md';
|
||||||
import { DatePicker } from 'asc-web-components';
|
import DatePicker from '.';
|
||||||
import Section from '../../.storybook/decorators/section';
|
import Section from '../../../.storybook/decorators/section';
|
||||||
import moment from 'moment';
|
import moment from 'moment';
|
||||||
import 'moment/min/locales'
|
import 'moment/min/locales'
|
||||||
|
|
||||||
@ -16,10 +16,10 @@ function myDateKnob(name, defaultValue) {
|
|||||||
|
|
||||||
const locales = moment.locales();
|
const locales = moment.locales();
|
||||||
|
|
||||||
storiesOf('Components|Date-picker', module)
|
storiesOf('Components|DatePicker', module)
|
||||||
.addDecorator(withKnobs)
|
.addDecorator(withKnobs)
|
||||||
.addDecorator(withReadme(Readme))
|
.addDecorator(withReadme(Readme))
|
||||||
.add('date-picker', () => (
|
.add('base', () => (
|
||||||
<Section>
|
<Section>
|
||||||
<DatePicker
|
<DatePicker
|
||||||
onChange={date => {
|
onChange={date => {
|
@ -0,0 +1,20 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { mount } from 'enzyme';
|
||||||
|
import DatePicker from '.';
|
||||||
|
|
||||||
|
describe('<DatePicker />', () => {
|
||||||
|
it('renders without error', () => {
|
||||||
|
const wrapper = mount(
|
||||||
|
<DatePicker
|
||||||
|
onChange={date => {
|
||||||
|
console.log('Selected date', date);
|
||||||
|
}}
|
||||||
|
selectedDate={new Date()}
|
||||||
|
minDate={new Date("1970/01/01")}
|
||||||
|
maxDate={new Date(new Date().getFullYear() + 1 + "/01/01")}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
|
||||||
|
expect(wrapper).toExist();
|
||||||
|
});
|
||||||
|
});
|
Loading…
Reference in New Issue
Block a user