release v2.6.1

jquense · May 28, 2015 · 336acee · 336acee
1 parent 3c373ee
commit 336acee
Show file tree

Hide file tree

Showing 36 changed files with 436 additions and 295 deletions.
diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "react-widgets",
-  "version": "2.6.0",
+  "version": "2.6.1",
   "main": "dist/react-widgets.js",
   "description": "A set of input widgets for React",
   "homepage": "http://jquense.github.io/react-widgets/docs",

diff --git a/dist/react-widgets.js b/dist/react-widgets.js
diff --git a/lib/Calendar.js b/lib/Calendar.js
@@ -13,6 +13,7 @@ var React = require('react'),
     Year = require('./Year'),
     Decade = require('./Decade'),
     Century = require('./Century'),
+    localizers = require('./util/configuration').locale,
     CustomPropTypes = require('./util/propTypes'),
     createUncontrolledWidget = require('uncontrollable'),
     SlideTransition = require('./SlideTransition'),
@@ -52,6 +53,10 @@ var MULTIPLIER = (_MULTIPLIER = {}, _MULTIPLIER[views.YEAR] = 1, _MULTIPLIER[vie
 
 var VIEW_FORMATS = (_VIEW_FORMATS = {}, _VIEW_FORMATS[views.MONTH] = 'dateFormat', _VIEW_FORMATS[views.YEAR] = 'monthFormat', _VIEW_FORMATS[views.DECADE] = 'yearFormat', _VIEW_FORMATS[views.CENTURY] = 'decadeFormat', _VIEW_FORMATS);
 
+var format = function format(props, f) {
+  return props[f + 'Format'] || localizers.date.formats[f];
+};
+
 var propTypes = {
 
   onChange: React.PropTypes.func,
@@ -77,15 +82,15 @@ var propTypes = {
 
   footer: React.PropTypes.bool,
 
-  headerFormat: CustomPropTypes.localeFormat,
-  footerFormat: CustomPropTypes.localeFormat,
+  headerFormat: CustomPropTypes.dateFormat,
+  footerFormat: CustomPropTypes.dateFormat,
 
-  dayFormat: CustomPropTypes.localeFormat,
-  dateFormat: CustomPropTypes.localeFormat,
-  monthFormat: CustomPropTypes.localeFormat,
-  yearFormat: CustomPropTypes.localeFormat,
-  decadeFormat: CustomPropTypes.localeFormat,
-  centuryFormat: CustomPropTypes.localeFormat,
+  dayFormat: CustomPropTypes.dateFormat,
+  dateFormat: CustomPropTypes.dateFormat,
+  monthFormat: CustomPropTypes.dateFormat,
+  yearFormat: CustomPropTypes.dateFormat,
+  decadeFormat: CustomPropTypes.dateFormat,
+  centuryFormat: CustomPropTypes.dateFormat,
 
   messages: React.PropTypes.shape({
     moveBack: React.PropTypes.string,
@@ -123,22 +128,6 @@ var Calendar = React.createClass({
       tabIndex: '0',
       footer: false,
 
-      headerFormat: dates.formats.MONTH_YEAR,
-      footerFormat: dates.formats.FOOTER,
-
-      dayFormat: dates.shortDay,
-      dateFormat: dates.formats.DAY_OF_MONTH,
-      monthFormat: dates.formats.MONTH_NAME_ABRV,
-      yearFormat: dates.formats.YEAR,
-
-      decadeFormat: function decadeFormat(dt, culture) {
-        return '' + dates.format(dt, dates.formats.YEAR, culture) + ' - ' + dates.format(dates.endOf(dt, 'decade'), dates.formats.YEAR, culture);
-      },
-
-      centuryFormat: function centuryFormat(dt, culture) {
-        return '' + dates.format(dt, dates.formats.YEAR, culture) + ' - ' + dates.format(dates.endOf(dt, 'century'), dates.formats.YEAR, culture);
-      },
-
       messages: msgs({})
     };
   },
@@ -346,7 +335,7 @@ var Calendar = React.createClass({
     var view = this.state.view;
     var dt = this.state.currentDate;
 
-    if (view === 'month') return dates.format(dt, props.headerFormat, culture);else if (view === 'year') return dates.format(dt, props.yearFormat, culture);else if (view === 'decade') return dates.format(dates.startOf(dt, 'decade'), props.decadeFormat, culture);else if (view === 'century') return dates.format(dates.startOf(dt, 'century'), props.centuryFormat, culture);
+    if (view === 'month') return localizers.date.format(dt, format(props, 'header'), culture);else if (view === 'year') return localizers.date.format(dt, format(props, 'year'), culture);else if (view === 'decade') return localizers.date.format(dates.startOf(dt, 'decade'), format(props, 'decade'), culture);else if (view === 'century') return localizers.date.format(dates.startOf(dt, 'century'), format(props, 'century'), culture);
   },
 
   inRangeValue: function inRangeValue(_value) {
@@ -377,22 +366,6 @@ function msgs(msgs) {
     moveForward: 'navigate forward' }, msgs);
 }
 
-function formats(obj) {
-  return babelHelpers._extends({
-    headerFormat: dates.formats.MONTH_YEAR,
-    dateFormat: dates.formats.DAY_OF_MONTH,
-    monthFormat: dates.formats.MONTH_NAME_ABRV,
-    yearFormat: dates.formats.YEAR,
-
-    decadeFormat: function decadeFormat(dt, culture) {
-      return '' + dates.format(dt, dates.formats.YEAR, culture) + ' - ' + dates.format(dates.endOf(dt, 'decade'), dates.formats.YEAR, culture);
-    },
-
-    centuryFormat: function centuryFormat(dt, culture) {
-      return '' + dates.format(dt, dates.formats.YEAR, culture) + ' - ' + dates.format(dates.endOf(dt, 'century'), dates.formats.YEAR, culture);
-    } }, obj);
-}
-
 module.exports = createUncontrolledWidget(Calendar, { value: 'onChange' });
 
 module.exports.BaseCalendar = Calendar;
diff --git a/lib/Century.js b/lib/Century.js
@@ -5,11 +5,16 @@ var babelHelpers = require('./util/babelHelpers.js');
 var React = require('react'),
     cx = require('classnames'),
     dates = require('./util/dates'),
+    localizers = require('./util/configuration').locale,
     directions = require('./util/constants').directions,
     Btn = require('./WidgetButton'),
     _ = require('./util/_'),
     CustomPropTypes = require('./util/propTypes'); //omit
 
+var format = function format(props) {
+  return props.decadeFormat || localizers.date.formats.decade;
+};
+
 module.exports = React.createClass({
 
   displayName: 'CenturyView',
@@ -24,7 +29,7 @@ module.exports = React.createClass({
 
     onChange: React.PropTypes.func.isRequired,
 
-    decadeFormat: CustomPropTypes.localeFormat.isRequired
+    decadeFormat: CustomPropTypes.dateFormat
   },
 
   render: function render() {
@@ -81,7 +86,7 @@ module.exports = React.createClass({
                 'rw-state-selected': selected,
                 'rw-now': currentDecade
               }) },
-            dates.format(dates.startOf(date, 'decade'), _this.props.decadeFormat, _this.props.culture)
+            localizers.date.format(dates.startOf(date, 'decade'), format(_this.props), _this.props.culture)
           )
         );
       })
@@ -90,10 +95,6 @@ module.exports = React.createClass({
 
 });
 
-function label(date, format, culture) {
-  return dates.format(dates.startOf(date, 'decade'), format, culture) + ' - ' + dates.format(dates.endOf(date, 'decade'), format, culture);
-}
-
 function inRangeDate(decade, min, max) {
   return dates.max(dates.min(decade, max), min);
 }

diff --git a/lib/DateInput.js b/lib/DateInput.js
@@ -6,14 +6,16 @@ var React = require('react'),
     cx = require('classnames'),
     dates = require('./util/dates'),
     compat = require('./util/compat'),
+    localizers = require('./util/configuration').locale,
     CustomPropTypes = require('./util/propTypes');
 
 module.exports = React.createClass({
 
   displayName: 'DatePickerInput',
 
   propTypes: {
-    format: CustomPropTypes.localeFormat,
+    format: CustomPropTypes.dateFormat.isRequired,
+    editFormat: CustomPropTypes.dateFormat,
     parse: React.PropTypes.func.isRequired,
 
     value: React.PropTypes.instanceOf(Date),
@@ -88,7 +90,7 @@ function isValid(d) {
 function formatDate(date, format, culture) {
   var val = '';
 
-  if (date instanceof Date && isValid(date)) val = dates.format(date, format, culture);
+  if (date instanceof Date && isValid(date)) val = localizers.date.format(date, format, culture);
 
   return val;
 }

diff --git a/lib/DateTimePicker.js b/lib/DateTimePicker.js
@@ -11,6 +11,7 @@ var React = require('react'),
 
 ,
     dates = require('./util/dates'),
+    localizers = require('./util/configuration').locale,
     views = require('./util/constants').calendarViews,
     popups = require('./util/constants').datePopups,
     Popup = require('./Popup'),
@@ -41,8 +42,9 @@ var propTypes = babelHelpers._extends({}, compat.type(Calendar).propTypes, {
 
   culture: React.PropTypes.string,
 
-  format: CustomPropTypes.localeFormat,
-  editFormat: CustomPropTypes.localeFormat,
+  format: CustomPropTypes.dateFormat,
+  timeFormat: CustomPropTypes.dateFormat,
+  editFormat: CustomPropTypes.dateFormat,
 
   calendar: React.PropTypes.bool,
   time: React.PropTypes.bool,
@@ -210,6 +212,7 @@ var DateTimePicker = React.createClass({
             optID: timeOptID,
             'aria-hidden': !this.props.open,
             value: value,
+            format: this.props.timeFormat,
             step: this.props.step,
             min: this.props.min,
             max: this.props.max,
@@ -363,13 +366,13 @@ function getFormat(props) {
   var cal = props[popups.CALENDAR] != null ? props.calendar : true,
       time = props[popups.TIME] != null ? props.time : true;
 
-  return props.format ? props.format : cal && time || !cal && !time ? 'f' : cal ? 'd' : 't';
+  return props.format ? props.format : cal && time || !cal && !time ? localizers.date.formats['default'] : localizers.date.formats[cal ? 'date' : 'time'];
 }
 
 function formatDate(date, format, culture) {
   var val = '';
 
-  if (date instanceof Date && !isNaN(date.getTime())) val = dates.format(date, format, culture);
+  if (date instanceof Date && !isNaN(date.getTime())) val = localizers.date.format(date, format, culture);
 
   return val;
 }
@@ -378,7 +381,7 @@ function formatsParser(formats, culture, str) {
   var date;
 
   for (var i = 0; i < formats.length; i++) {
-    date = dates.parse(str, formats[i], culture);
+    date = localizers.date.parse(str, formats[i], culture);
     if (date) return date;
   }
   return null;

diff --git a/lib/Decade.js b/lib/Decade.js
@@ -6,9 +6,14 @@ var React = require('react'),
     _ = require('./util/_'),
     cx = require('classnames'),
     dates = require('./util/dates'),
+    localizers = require('./util/configuration').locale,
     CustomPropTypes = require('./util/propTypes'),
     Btn = require('./WidgetButton');
 
+var format = function format(props) {
+  return props.yearFormat || localizers.date.formats.year;
+};
+
 module.exports = React.createClass({
 
   displayName: 'DecadeView',
@@ -24,7 +29,7 @@ module.exports = React.createClass({
     max: React.PropTypes.instanceOf(Date),
     onChange: React.PropTypes.func.isRequired,
 
-    yearFormat: CustomPropTypes.localeFormat.isRequired
+    yearFormat: CustomPropTypes.dateFormat
 
   },
 
@@ -80,7 +85,7 @@ module.exports = React.createClass({
                 'rw-state-selected': selected,
                 'rw-now': currentYear
               }) },
-            dates.format(date, _this.props.yearFormat, _this.props.culture)
+            localizers.date.format(date, format(_this.props), _this.props.culture)
           )
         );
       })
@@ -96,7 +101,7 @@ function getDecadeYears(_date) {
   var days = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
       date = dates.add(dates.startOf(_date, 'decade'), -2, 'year');
 
-  return days.map(function (i) {
+  return days.map(function () {
     return date = dates.add(date, 1, 'year');
   });
 }

diff --git a/lib/DropdownList.js b/lib/DropdownList.js
@@ -249,6 +249,7 @@ var DropdownList = React.createClass({
         key = e.key,
         alt = e.altKey,
         list = this.refs.list,
+        filtering = this.props.filter,
         focusedItem = this.state.focusedItem,
         selectedItem = this.state.selectedItem,
         isOpen = this.props.open,
@@ -264,7 +265,7 @@ var DropdownList = React.createClass({
       e.preventDefault();
     } else if (key === 'Escape' && isOpen) {
       closeWithFocus();
-    } else if ((key === 'Enter' || key === ' ') && isOpen) {
+    } else if ((key === 'Enter' || key === ' ' && !filtering) && isOpen) {
       change(this.state.focusedItem, true);
     } else if (key === 'ArrowDown') {
       if (alt) this.open();else if (isOpen) this.setState({ focusedItem: list.next(focusedItem) });else change(list.next(selectedItem));

diff --git a/lib/Footer.js b/lib/Footer.js
@@ -2,15 +2,20 @@
 
 var React = require('react'),
     Btn = require('./WidgetButton'),
-    dates = require('./util/dates');
+    dates = require('./util/dates'),
+    localizers = require('./util/configuration').locale;
+
+var format = function format(props) {
+  return props.format || localizers.date.formats.footer;
+};
 
 module.exports = React.createClass({
 
   displayName: 'Footer',
 
   render: function render() {
     var now = this.props.value,
-        formatted = dates.format(now, this.props.format, this.props.culture);
+        formatted = localizers.date.format(now, format(this.props), this.props.culture);
 
     return React.createElement(
       'div',

diff --git a/lib/Month.js b/lib/Month.js
@@ -5,10 +5,18 @@ var babelHelpers = require('./util/babelHelpers.js');
 var React = require('react'),
     cx = require('classnames'),
     dates = require('./util/dates'),
+    localizers = require('./util/configuration').locale,
     CustomPropTypes = require('./util/propTypes'),
     _ = require('./util/_'),
     Btn = require('./WidgetButton');
 
+var dayFormat = function dayFormat(props) {
+  return props.dayFormat || localizers.date.formats.weekday;
+},
+    dateFormat = function dateFormat(props) {
+  return props.dateFormat || localizers.date.formats.dayOfMonth;
+};
+
 module.exports = React.createClass({
 
   displayName: 'MonthView',
@@ -22,8 +30,8 @@ module.exports = React.createClass({
     min: React.PropTypes.instanceOf(Date),
     max: React.PropTypes.instanceOf(Date),
 
-    dayFormat: CustomPropTypes.localeFormat.isRequired,
-    dateFormat: CustomPropTypes.localeFormat.isRequired,
+    dayFormat: CustomPropTypes.dateFormat,
+    dateFormat: CustomPropTypes.dateFormat,
 
     onChange: React.PropTypes.func.isRequired },
 
@@ -44,7 +52,7 @@ module.exports = React.createClass({
         React.createElement(
           'tr',
           null,
-          this._headers(props.dayFormat, props.culture)
+          this._headers(dayFormat(this.props), props.culture)
         )
       ),
       React.createElement(
@@ -90,7 +98,7 @@ module.exports = React.createClass({
                 'rw-now': today
               }),
               id: focused ? id : undefined },
-            dates.format(day, _this.props.dateFormat, _this.props.culture)
+            localizers.date.format(day, dateFormat(_this.props), _this.props.culture)
           )
         );
       })
@@ -102,7 +110,7 @@ module.exports = React.createClass({
       return React.createElement(
         'th',
         { key: 'header_' + day },
-        dates.format(day, format, culture)
+        localizers.date.format(day, format, culture)
       );
     });
   }