From e75ed0c6b89282cf475e94d6d5ad0fb35803f974 Mon Sep 17 00:00:00 2001 From: MG12 Date: Thu, 19 Nov 2015 11:59:53 +0800 Subject: [PATCH] update placement handle --- HISTORY.md | 13 +++++++++++-- README.md | 36 +++++++++++++++++++----------------- assets/index/Picker.less | 29 +++++++++++++++++++++++++++++ package.json | 2 +- src/TimePicker.jsx | 7 +++++-- src/util/placements.js | 8 ++++---- 6 files changed, 69 insertions(+), 26 deletions(-) diff --git a/HISTORY.md b/HISTORY.md index 5be49af..15c1e02 100644 --- a/HISTORY.md +++ b/HISTORY.md @@ -1,8 +1,17 @@ -History -======= +# History --- +0.5.4 / 2015-11-19 +------------------ + +`update` change value prop to defaultValue. + +0.5.2 / 2015-11-19 +------------------ + +`update` renew placements config. + 0.5.1 / 2015-11-19 ------------------ diff --git a/README.md b/README.md index c6e8e1c..1ab1239 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,4 @@ -TimePicker -========== +# TimePicker React TimePicker @@ -25,21 +24,24 @@ API ### TimePicker -| Name | Type | Default | Description | -|---------------|----------------------------|-----------------------------------------------|-----------------------------------------------| -| prefixCls | String | | prefixCls of this component | -| locale | Object | import from 'rc-time-picker/lib/locale/en_US' | | -| disabled | Boolean | false | whether picker is disabled | -| open | Boolean | false | current open state of picker. controlled prop | -| value | GregorianCalendar | null | current value like input's value | -| placeholder | String | '' | time input's placeholder | -| formatter | GregorianCalendarFormatter | HH:mm:ss or HH:mm or mm:ss | | -| hourOptions | Array | hour options | | -| minuteOptions | Array | minute options | | -| secondOptions | Array | second options | | -| onChange | Function | null | called when select a different value | -| onOpen | Function | null | called when open picker | -| onClose | Function | null | called when close picker | +| Name | Type | Default | Description | +|----------------|----------------------------|-----------------------------------------------|--------------------------------------------------------------------------------------------| +| prefixCls | String | | prefixCls of this component | +| locale | Object | import from 'rc-time-picker/lib/locale/en_US' | | +| disabled | Boolean | false | whether picker is disabled | +| open | Boolean | false | current open state of picker. controlled prop | +| defaultValue | GregorianCalendar | null | current value like input's value | +| placeholder | String | '' | time input's placeholder | +| formatter | GregorianCalendarFormatter | HH:mm:ss or HH:mm or mm:ss | | +| hourOptions | Array | hour options | | +| minuteOptions | Array | minute options | | +| secondOptions | Array | second options | | +| onChange | Function | null | called when select a different value | +| onOpen | Function | null | called when open picker | +| onClose | Function | null | called when close picker | +| inputClassName | String | '' | | +| placement | String | bottomLeft | one of ['left','right','top','bottom', 'topLeft', 'topRight', 'bottomLeft', 'bottomRight'] | +| transitionName | String | '' | | License ------- diff --git a/assets/index/Picker.less b/assets/index/Picker.less index 769c4b7..507121f 100644 --- a/assets/index/Picker.less +++ b/assets/index/Picker.less @@ -1,3 +1,32 @@ +.@{prefixClass}-picker-container { + z-index: 1070; + position: absolute; + + &.slide-up-enter.slide-up-enter-active&-placement-topLeft, + &.slide-up-enter.slide-up-enter-active&-placement-topRight, + &.slide-up-appear.slide-up-appear-active&-placement-topLeft, + &.slide-up-appear.slide-up-appear-active&-placement-topRight { + animation-name: antSlideDownIn; + } + + &.slide-up-enter.slide-up-enter-active&-placement-bottomLeft, + &.slide-up-enter.slide-up-enter-active&-placement-bottomRight, + &.slide-up-appear.slide-up-appear-active&-placement-bottomLeft, + &.slide-up-appear.slide-up-appear-active&-placement-bottomRight { + animation-name: antSlideUpIn; + } + + &.slide-up-leave.slide-up-leave-active&-placement-topLeft, + &.slide-up-leave.slide-up-leave-active&-placement-topRight { + animation-name: antSlideDownOut; + } + + &.slide-up-leave.slide-up-leave-active&-placement-bottomLeft, + &.slide-up-leave.slide-up-leave-active&-placement-bottomRight { + animation-name: antSlideUpOut; + } +} + .@{prefixClass} { &-picker { } diff --git a/package.json b/package.json index 437d9b1..563eb5d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "rc-time-picker", - "version": "0.5.1", + "version": "0.5.4", "description": "React TimePicker", "keywords": [ "react", diff --git a/src/TimePicker.jsx b/src/TimePicker.jsx index a6ea7a9..98a1754 100644 --- a/src/TimePicker.jsx +++ b/src/TimePicker.jsx @@ -50,8 +50,11 @@ const Picker = React.createClass({ getInitialState() { this.savePanelRef = refFn.bind(this, 'panelInstance'); - const { open, value } = this.props; - return { open, value }; + const { open, defaultValue } = this.props; + return { + open: open, + value: defaultValue, + }; }, componentWillReceiveProps(nextProps) { diff --git a/src/util/placements.js b/src/util/placements.js index 2574da1..6760286 100644 --- a/src/util/placements.js +++ b/src/util/placements.js @@ -6,25 +6,25 @@ const autoAdjustOverflow = { const targetOffset = [0, 0]; const placements = { - topLeft: { + bottomLeft: { points: ['tl', 'tl'], overflow: autoAdjustOverflow, offset: [0, -3], targetOffset, }, - topRight: { + bottomRight: { points: ['tr', 'tr'], overflow: autoAdjustOverflow, offset: [0, -3], targetOffset, }, - bottomRight: { + topRight: { points: ['br', 'br'], overflow: autoAdjustOverflow, offset: [0, 3], targetOffset, }, - bottomLeft: { + topLeft: { points: ['bl', 'bl'], overflow: autoAdjustOverflow, offset: [0, 3], -- 2.41.0