Test/quick merge

.gitignore

@@ -27,4 +27,5 @@ lib
 es
 coverage
 yarn.lock
-.vscode
+.vscode
+package-lock.json

.travis.yml

@@ -5,9 +5,10 @@ sudo: false
 notifications:
   email:
   - [email protected]
+  - [email protected]
 
 node_js:
-- 6.9.1
+- 10
 
 before_install:
 - |
@@ -21,12 +22,12 @@ before_install:
 script:
 - |
     if [ "$TEST_TYPE" = test ]; then
-      npm test
+      npm test -- --coverage && \
+      bash <(curl -s https://codecov.io/bash)
     else
       npm run $TEST_TYPE
     fi
 env:
   matrix:
   - TEST_TYPE=lint
   - TEST_TYPE=test
-  - TEST_TYPE=coverage

HISTORY.md

@@ -1,6 +1,56 @@
 # History
 ----
 
+## 9.13.0 / 2019-04-02
+
+- Support close onBlur
+
+## 9.12.0 / 2019-03-16
+
+- RangerPicker support null as start or end
+
+## 9.11.0 / 2019-03-14
+
+- RangerPicker can select same month
+
+## 9.10.0 / 2019-01-02
+
+- add `focusablePanel` prop.
+
+## 9.9.0 / 2018-12-23
+
+- `renderFooter(mode)` support all modes.
+
+## 9.8.0 / 2018-11-30
+
+- DateInput support multiple date format
+
+## 9.7.0 / 2018-08-07
+
+- Add clearIcon.
+
+## 9.6.0 / 2018-02-08
+
+- Add Picker[dropdownClassName]
+
+## 9.5.0 / 2017-12-26
+
+- Add Kurdish
+
+## 9.4.0 / 2017-12-26
+
+- Add Uyghur
+
+## 9.2.0 / 2017-11-06
+
+- React 16 support
+
+## 9.1.0 / 2017-07-27
+- Support control panel [#284](https://github.com/react-component/calendar/pull/284)
+
+## 9.0.0 / 2017-07-27
+- Replace react string refs with function way [#282](https://github.com/react-component/calendar/pull/282)
+
 ## 8.4.0 / 2017-05-31
 
 - Supporting Bulgarian.

README.md

@@ -5,22 +5,28 @@ React Calendar
 
 [![NPM version][npm-image]][npm-url]
 [![build status][travis-image]][travis-url]
-[![Test coverage][coveralls-image]][coveralls-url]
+[![Test coverage][codecov-image]][codecov-url]
 [![gemnasium deps][gemnasium-image]][gemnasium-url]
 [![npm download][download-image]][download-url]
+[![Code Quality: Javascript][lgtm-badge]][lgtm-badge-url]
+[![Total alerts][lgtm-alerts]][lgtm-alerts-url]
 
 [npm-image]: http://img.shields.io/npm/v/rc-calendar.svg?style=flat-square
 [npm-url]: http://npmjs.org/package/rc-calendar
 [travis-image]: https://img.shields.io/travis/react-component/calendar.svg?style=flat-square
 [travis-url]: https://travis-ci.org/react-component/calendar
-[coveralls-image]: https://img.shields.io/coveralls/react-component/calendar.svg?style=flat-square
-[coveralls-url]: https://coveralls.io/r/react-component/calendar?branch=master
+[codecov-image]: https://img.shields.io/codecov/c/github/react-component/calendar/master.svg?style=flat-square
+[codecov-url]: https://codecov.io/gh/react-component/calendar/branch/master
 [gemnasium-image]: http://img.shields.io/gemnasium/react-component/calendar.svg?style=flat-square
 [gemnasium-url]: https://gemnasium.com/react-component/calendar
 [node-image]: https://img.shields.io/badge/node.js-%3E=_0.10-green.svg?style=flat-square
 [node-url]: http://nodejs.org/download/
 [download-image]: https://img.shields.io/npm/dm/rc-calendar.svg?style=flat-square
 [download-url]: https://npmjs.org/package/rc-calendar
+[lgtm-badge]: https://img.shields.io/lgtm/grade/javascript/g/react-component/calendar.svg?logo=lgtm&logoWidth=18
+[lgtm-badge-url]: https://lgtm.com/projects/g/react-component/calendar/context:javascript
+[lgtm-alerts]: https://img.shields.io/lgtm/alerts/g/react-component/calendar.svg?logo=lgtm&logoWidth=18
+[lgtm-alerts-url]: https://lgtm.com/projects/g/react-component/calendar/alerts
 
 ## Screenshots
 
@@ -124,7 +130,7 @@ http://react-component.github.io/calendar/examples/index.html
         </tr>
         <tr>
           <td>renderFooter</td>
-          <td>() => React.Node</td>
+          <td>(mode) => React.Node</td>
           <td></td>
           <td>extra footer</td>
         </tr>
@@ -148,9 +154,10 @@ http://react-component.github.io/calendar/examples/index.html
         </tr>
         <tr>
           <td>format</td>
-          <td>String</td>
+          <td>String | String[]</td>
           <td>depends on whether you set timePicker and your locale</td>
-          <td>use to format/parse date(without time) value to/from input</td>
+          <td>use to format/parse date(without time) value to/from input.  
+          When an array is provided, all values are used for parsing and first value for display.</td>
         </tr>
         <tr>
           <td>disabledDate</td>
@@ -200,18 +207,48 @@ http://react-component.github.io/calendar/examples/index.html
           <td></td>
           <td>called when a date is selected from calendar</td>
         </tr>
+        <tr>
+          <td>onClear</td>
+          <td>Function()</td>
+          <td></td>
+          <td>called when a date is cleared from calendar</td>
+        </tr>
         <tr>
           <td>onChange</td>
           <td>Function(date: moment)</td>
           <td></td>
           <td>called when a date is changed inside calendar (next year/next month/keyboard)</td>
         </tr>
+        <tr>
+          <td>onOk</td>
+          <td>Function(date: moment)</td>
+          <td></td>
+          <td>called when ok button is pressed, only if it's visible</td>
+        </tr>
         <tr>
           <td>dateInputPlaceholder</td>
           <td>String</td>
           <td></td>
           <td>date input's placeholder</td>
         </tr>
+        <tr>
+          <td>mode</td>
+          <td>enum('time', 'date', 'month', 'year', 'decade')</td>
+          <td>'date'</td>
+          <td>control which kind of panel should be shown</td>
+        </tr>
+        <tr>
+          <td>onPanelChange</td>
+          <td>Function(date: moment, mode)</td>
+          <td></td>
+          <td>called when panel changed</td>
+        </tr>
+        <tr>
+          <td>clearIcon</td>
+          <td>ReactNode</td>
+          <td></td>
+          <td>specific the clear icon.</td>
+        </tr>
     </tbody>
 </table>
 
@@ -324,12 +361,30 @@ http://react-component.github.io/calendar/examples/index.html
           <td></td>
           <td>called when a date range is selected from calendar</td>
         </tr>
+        <tr>
+          <td>onInputSelect</td>
+          <td>Function(date: moment[])</td>
+          <td></td>
+          <td>called when a valid date entered in input</td>
+        </tr>
+        <tr>
+          <td>onClear</td>
+          <td>Function()</td>
+          <td></td>
+          <td>called when a date range is cleared from calendar</td>
+        </tr>
         <tr>
           <td>onChange</td>
           <td>Function(date: moment[])</td>
           <td></td>
           <td>called when a date range is changed inside calendar (next year/next month/keyboard)</td>
         </tr>
+        <tr>
+          <td>onOk</td>
+          <td>Function(date: moment)</td>
+          <td></td>
+          <td>called when ok button is pressed, only if it's visible</td>
+        </tr>
         <tr>
           <td>dateInputPlaceholder</td>
           <td>String[]</td>
@@ -342,12 +397,48 @@ http://react-component.github.io/calendar/examples/index.html
           <td></td>
           <td>a function which return a object with member of disabledHours/disabledMinutes/disabledSeconds according to rc-time-picker</td>
         </tr>
+        <tr>
+          <td>showDateInput</td>
+          <td>Boolean</td>
+          <td>true</td>
+          <td>whether to show date inputs on top of calendar panels</td>
+        </tr>
         <tr>
           <td>type</td>
           <td>enum('both','start', 'end')</td>
           <td>both</td>
           <td>whether fix start or end selected value. check start-end-range example</td>
         </tr>
+        <tr>
+          <td>mode</td>
+          <td>enum('date', 'month', 'year', 'decade')[]</td>
+          <td>['date', 'date']</td>
+          <td>control which kind of panels should be shown</td>
+        </tr>
+        <tr>
+          <td>onPanelChange</td>
+          <td>Function(date: moment[], mode)</td>
+          <td></td>
+          <td>called when panels changed</td>
+        </tr>
+        <tr>
+          <td>hoverValue</td>
+          <td>moment[]</td>
+          <td></td>
+          <td>control hover value</td>
+        </tr>
+        <tr>
+          <td>onHoverChange</td>
+          <td>Function(hoverValue: moment[])</td>
+          <td></td>
+          <td>called when hover value change</td>
+        </tr>
+        <tr>
+          <td>clearIcon</td>
+          <td>ReactNode</td>
+          <td></td>
+          <td>specific the clear icon.</td>
+        </tr>
     </tbody>
 </table>
 
@@ -436,6 +527,12 @@ http://react-component.github.io/calendar/examples/index.html
           <td></td>
           <td>called when a date is changed inside calendar (next year/next month/keyboard)</td>
         </tr>
+        <tr>
+          <td>renderFooter</td>
+          <td>() => React.Node</td>
+          <td></td>
+          <td>extra footer</td>
+        </tr>
     </tbody>
 </table>
 
@@ -529,6 +626,12 @@ http://react-component.github.io/calendar/examples/index.html
           <td>() => {return document.body;}</td>
           <td>dom node where calendar to be rendered into</td>
         </tr>
+        <tr>
+          <td>dropdownClassName</td>
+          <td>string</td>
+          <td></td>
+          <td>additional className applied to dropdown</td>
+        </tr>
     </tbody>
 </table>
 

assets/common/Calendar.less

@@ -31,9 +31,7 @@
         }
         &-select {
           width: 84px;
-          ul {
-            max-height: 217px;
-          }
+          max-height: 217px;
           li {
             text-align: center;
             padding: 0;

assets/common/RangeCalendar.less

@@ -94,7 +94,8 @@
   }
 
   .@{prefixClass}-year-panel,
-  .@{prefixClass}-month-panel {
+  .@{prefixClass}-month-panel,
+  .@{prefixClass}-decade-panel {
     top: @input-box-height;
   }
   .@{prefixClass}-month-panel .@{prefixClass}-year-panel {

assets/index.less

@@ -7,4 +7,4 @@
 @import "index/YearPanel";
 @import "index/DecadePanel";
 @import "common/RangeCalendar";
-@import "common/FullCalendar";
+@import "common/FullCalendar";

assets/index/Calendar.less

@@ -81,6 +81,10 @@
       cursor: pointer;
       color: #23c0fa;
     }
+    &.@{prefixClass}-time-status:hover{
+      cursor: pointer;
+      color: #666;
+    }
   }
 
   &-prev-month-btn,
@@ -288,4 +292,4 @@
   &-today-btn {
     padding-left: 10px;
   }
-}
+}

assets/index/DecadePanel.less

@@ -7,6 +7,8 @@
   z-index: 10;
   position: absolute;
   outline: none;
+  display: flex;
+  flex-direction: column;
 }
 
 .@{prefixClass}-decade-panel-hidden {
@@ -62,13 +64,19 @@
 }
 
 .@{prefixClass}-decade-panel-body {
+  flex: 1;
   padding: 9px 10px 10px;
 }
 
+.@{prefixClass}-decade-panel-footer {
+  border-top: 1px solid #ccc;
+  line-height: 38px;
+}
+
 .@{prefixClass}-decade-panel-table {
   table-layout: fixed;
   width: 100%;
-  height: 255px;
+  height: 100%;
   border-collapse: separate;
 }