Skip to content

Commit

Permalink
feat(DatePicker): Add WeekPicker (#1284)
Browse files Browse the repository at this point in the history 
* feat(Calendar): export Calendar.RangeCalendar

* feat(DatePicker): Add WeekPicker
  • Loading branch information
@myronliu347 @youluna
myronliu347 authored and youluna committed Nov 20, 2019
1 parent 91b346c commit 42de085
Show file tree
Hide file tree
Showing 20 changed files with 886 additions and 32 deletions.
5 changes: 4 additions & 1 deletion docs/date-picker/demo/basic.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,13 +18,16 @@ A basic usage case.
````jsx
import { DatePicker } from '@alifd/next';

const { RangePicker, MonthPicker, YearPicker } = DatePicker;
const { RangePicker, MonthPicker, YearPicker, WeekPicker } = DatePicker;
const onChange = val => console.log(val);

ReactDOM.render(<div>
<DatePicker onChange={onChange} /> <br /><br />
<MonthPicker onChange={onChange} /> <br /><br />
<YearPicker onChange={onChange} /> <br /><br />
<WeekPicker onChange={onChange} /> <br /><br />
<RangePicker type="year" onChange={onChange} /><br /><br />
<RangePicker type="month" onChange={onChange} /><br /><br />
<RangePicker onChange={onChange} />
</div>, mountNode);
````
2 changes: 2 additions & 0 deletions docs/date-picker/demo/default.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,8 @@ ReactDOM.render(<div>
<DatePicker defaultValue={startValue} onChange={onChange} /><br /><br />
<MonthPicker defaultValue={startValue} onChange={onChange} /><br /><br />
<YearPicker defaultValue={startValue} onChange={onChange} /><br /><br />
<RangePicker type="year" defaultValue={[startValue, endValue]} onChange={onChange} /><br /><br />
<RangePicker type="month" defaultValue={[startValue, endValue]} onChange={onChange} /><br /><br />
<RangePicker defaultValue={[startValue, endValue]} onChange={onChange} />
</div>, mountNode);
````
28 changes: 28 additions & 0 deletions docs/date-picker/index.en-us.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,7 @@ DatePicker are used to select a single date for an input.
| Param | Description | Type | Default Value |
| ------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------- | ------------ |
| size | Size of input <br><br>**option**:<br>'small', 'medium', 'large' | Enum | 'medium' |
| type (v1.19.0+) | Select date range type<br><br>**option**:<br>'date', 'month', 'year' | Enum | 'date' | | |
| defaultVisibleMonth | Default visible month <br><br>**signature**:<br>Function() => MomentObject<br>**return**:<br>{MomentObject} moment instance with specified month<br> | Function | - |
| value | Range value `[moment, moment]` | Array | - |
| defaultValue | Default range value `[moment, moment]` | Array | - |
Expand Down Expand Up @@ -78,6 +79,33 @@ DatePicker are used to select a single date for an input.
| endDateInputAriaLabel | End date input `aria-label` attribute | String | - | | |
| endTimeInputAriaLabel | End time input `aria-label` attribute | String | - | | |

### DatePicker.WeekPicker v1.19.0+

| 参数 | 说明 | 类型 | 默认值 |
| ------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------- | ----------- |
| label | Inset label of input | ReactNode | - |
| size | Size of input<br><br>**option**:<br>'small', 'medium', 'large' | Enum | 'medium' |
| state | State of input<br><br>**option**:<br>'success', 'error' | Enum | - |
| placeholder | Placeholder of input | String | - |
| defaultVisibleMonth | Default visible month <br><br>**signature**:<br>Function() => MomentObject<br>**return**:<br>{MomentObject} moment instance with specified month<br> | Function | - |
| value | Value of date-picker | moment | - |
| defaultValue | Default value of date-picker | moment | - |
| format | Format of date value (it will also effect user input) | String | 'YYYY-wo' |

| disabledDate | Function to disable date <br><br>**signature**:<br>Function(dateValue: MomentObject) => Boolean<br>**parameter**:<br>_dateValue_: {MomentObject} null<br>_view_: {Enum} current view type: 'year', 'month', 'date'<br>**return**:<br>{Boolean} if disable current date<br> | Function | () => false |
| footerRender | Template render for custom footer<br><br>**signature**:<br>Function() => Node<br>**return**:<br>{Node} Custom footer<br> | Function | () => null |
| onChange | Callback when date changes <br><br>**signature**:<br>Function() => MomentObject<br>**return**:<br>{MomentObject} dateValue<br> | Function | func.noop |
| disabled | Disable the picker | Boolean | - |
| hasClear | Has clear icon | Boolean | true |
| visible | Visible state of popup | Boolean | - |
| defaultVisible | Default visible state of popup | Boolean | - |
| onVisibleChange | Callback when visible state changes<br><br>**signature**:<br>Function(visible: Boolean, reason: String) => void<br>**parameter**:<br>_visible_: {Boolean} if popup visible<br>_reason_: {String} reason to change visible | Function | func.noop |
| popupTriggerType | Trigger type of popup <br><br>**option**:<br>'click', 'hover' | Enum | 'click' |
| popupAlign | Align of popup | String | 'tl tl' |
| popupContainer | Container of a popup<br><br>**signature**:<br>Function(target: Element) => Element<br>**option**:<br>_target_: {Element} target element<br>**return**:<br>{Element} coninter element of popup<br> | Function | - |
| popupStyle | Custom style of popup | Object | - |
| popupClassName | Custom className of popup | String | - |
| popupProps | Props of popup | Object | - |


## ARIA and KeyBoard
Expand Down
Loading

0 comments on commit 42de085

Please sign in to comment.