react-moment 0.8.0 → 0.8.4

package/src/index.jsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import moment from 'moment';
+import 'moment-duration-format';
 import { objectKeyFilter } from './objects';
 
 const dateTypes = [
@@ -22,35 +23,37 @@ const calendarTypes = [
 
 export default class Moment extends React.Component {
   static propTypes = {
-    element:       PropTypes.any,
-    date:          PropTypes.oneOfType(dateTypes),
-    parse:         PropTypes.oneOfType(parseTypes),
-    format:        PropTypes.string,
-    add:           PropTypes.object,
-    subtract:      PropTypes.object,
-    ago:           PropTypes.bool,
-    fromNow:       PropTypes.bool,
-    fromNowDuring: PropTypes.number,
-    from:          PropTypes.oneOfType(dateTypes),
-    toNow:         PropTypes.bool,
-    to:            PropTypes.oneOfType(dateTypes),
-    calendar:      PropTypes.oneOfType(calendarTypes),
-    unix:          PropTypes.bool,
-    utc:           PropTypes.bool,
-    tz:            PropTypes.string,
-    withTitle:     PropTypes.bool,
-    titleFormat:   PropTypes.string,
-    locale:        PropTypes.string,
-    interval:      PropTypes.number,
-    diff:          PropTypes.oneOfType(dateTypes),
-    unit:          PropTypes.string,
-    decimal:       PropTypes.bool,
-    filter:        PropTypes.func,
-    onChange:      PropTypes.func
+    element:         PropTypes.any,
+    date:            PropTypes.oneOfType(dateTypes),
+    parse:           PropTypes.oneOfType(parseTypes),
+    format:          PropTypes.string,
+    add:             PropTypes.object,
+    subtract:        PropTypes.object,
+    ago:             PropTypes.bool,
+    fromNow:         PropTypes.bool,
+    fromNowDuring:   PropTypes.number,
+    from:            PropTypes.oneOfType(dateTypes),
+    toNow:           PropTypes.bool,
+    to:              PropTypes.oneOfType(dateTypes),
+    calendar:        PropTypes.oneOfType(calendarTypes),
+    unix:            PropTypes.bool,
+    utc:             PropTypes.bool,
+    tz:              PropTypes.string,
+    withTitle:       PropTypes.bool,
+    titleFormat:     PropTypes.string,
+    locale:          PropTypes.string,
+    interval:        PropTypes.number,
+    diff:            PropTypes.oneOfType(dateTypes),
+    duration:        PropTypes.oneOfType(dateTypes),
+    durationFromNow: PropTypes.bool,
+    unit:            PropTypes.string,
+    decimal:         PropTypes.bool,
+    filter:          PropTypes.func,
+    onChange:        PropTypes.func
   };
 
   static defaultProps = {
-    element:     'time',
+    element:     null,
     fromNow:     false,
     toNow:       false,
     calendar:    false,
@@ -71,7 +74,7 @@ export default class Moment extends React.Component {
   static globalFormat   = null;
   static globalParse    = null;
   static globalFilter   = null;
-  static globalElement  = null;
+  static globalElement  = 'time';
   static globalTimezone = null;
   static pooledElements = [];
   static pooledTimer    = null;
@@ -272,7 +275,7 @@ export default class Moment extends React.Component {
     props = props || this.props;
     const {
       fromNow, fromNowDuring, from, add, subtract, toNow, to, ago,
-      calendar, diff, unit, decimal
+      calendar, diff, duration, durationFromNow, unit, decimal
     } = props;
 
     let { format } = props;
@@ -302,10 +305,19 @@ export default class Moment extends React.Component {
       content = datetime.calendar(null, calendar);
     } else if (diff) {
       content = datetime.diff(diff, unit, decimal);
+    } else if (duration) {
+      content = datetime.diff(duration);
+    } else if (durationFromNow) {
+      content = moment().diff(datetime);
     } else {
       content = datetime.toString();
     }
 
+    if (duration || durationFromNow) {
+      content = moment.duration(content);
+      content = content.format(format);
+    }
+
     const filter = Moment.globalFilter || this.props.filter;
     content = filter(content);
 
@@ -325,7 +337,7 @@ export default class Moment extends React.Component {
       props.title = this.getTitle();
     }
 
-    return React.createElement(Moment.globalElement || this.props.element, {
+    return React.createElement(this.props.element || Moment.globalElement, {
       dateTime: Moment.getDatetime(this.props),
       ...props
     },

package/tests/index.jsx

@@ -297,4 +297,20 @@ describe('react-moment', () => {
     );
     expect(ReactDOM.findDOMNode(date).innerHTML).toEqual('1976-04-19 09');
   });
+
+  it('globalElement', () => {
+    Moment.globalElement = 'span';
+    const date = TestUtils.renderIntoDocument(
+      <Moment parse="YYYY-MM-DD HH:mm">1976-04-19 12:59</Moment>
+    );
+    expect(ReactDOM.findDOMNode(date).tagName).toEqual('SPAN');
+  });
+
+  it('globalElement overwrite', () => {
+    Moment.globalElement = 'span';
+    const date = TestUtils.renderIntoDocument(
+      <Moment element="div" parse="YYYY-MM-DD HH:mm">1976-04-19 12:59</Moment>
+    );
+    expect(ReactDOM.findDOMNode(date).tagName).toEqual('DIV');
+  });
 });