Merge branch 'master' into feature/unit-in-onZoom-and-onTimeChange-callbacks

Author: Ilaiwi

CHANGELOG.md

@@ -8,6 +8,8 @@ and this project adheres (more or less) to [Semantic Versioning](http://semver.o
 ## Unreleased
 
 * Add unit argument to onZoom and onTimeChange callbacks
+* Add `className` prop to Timeline component to override `react-calendar-timeline` class #682
+* Fix injecting custom vertical line's class names for time periods longer than day
 
 ## 0.26.7
 

README.md

@@ -162,6 +162,10 @@ An array specifying keys in the `items` and `groups` objects. Defaults to
 }
 ```
 
+## className
+
+Additional class names as a string for the root Timeline element.
+
 ## sidebarWidth
 
 Width of the sidebar in pixels. If set to `0`, the sidebar is not rendered. Defaults to `150`.
@@ -300,11 +304,11 @@ Called when the item is clicked by the right button of the mouse. `time` is the
 
 Called when an empty spot on the canvas was clicked. Get the group ID and the time as arguments. For example open a "new item" window after this.
 
-## onCanvasDoubleClick(group, time, e)
+## onCanvasDoubleClick(groupId, time, e)
 
-Called when an empty spot on the canvas was double clicked. Get the group and the time as arguments.
+Called when an empty spot on the canvas was double clicked. Get the group ID and the time as arguments.
 
-## onCanvasContextMenu(group, time, e)
+## onCanvasContextMenu(groupId, time, e)
 
 Called when the canvas is clicked by the right button of the mouse. Note: If this property is set the default context menu doesn't appear
 
@@ -431,7 +435,8 @@ Rather than applying props on the element yourself and to avoid your props being
   * onTouchEnd: event handler
   * onDoubleClick: event handler
   * onContextMenu: event handler
-  * style: inline object style
+  * style: inline object
+
 
   \*\* _the given styles will only override the styles that are not a requirement for positioning the item. Other styles like `color`, `radius` and others_
 
@@ -1258,7 +1263,7 @@ $ yarn start
 
 Check http://0.0.0.0:8888/ in your browser and have fun!
 
-Please run `npm run lint` before you send a pull request. `npm run jest` runs the tests.
+Please run `npm run lint` before you send a pull request. `npm run test` runs the jest tests.
 
 <!--
 

examples/README.md

@@ -70,7 +70,7 @@ Controlled visible port of the calendar using `visibleTimeStart` and `visibleTim
 
 Using controlled scroll and react-spring to trigger scrolling and create an animation.
 
-[Example Codesandbox](https://codesandbox.io/s/confident-waterfall-3kq2503y8p)
+[Example Codesandbox](https://codesandbox.io/s/timeline-demo-programmatic-scroll-3kq2503y8p)
 
 ## Sticky header
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-calendar-timeline",
-  "version": "0.26.7",
+  "version": "0.27.0",
   "description": "react calendar timeline",
   "main": "lib/index.js",
   "scripts": {
@@ -93,7 +93,7 @@
   },
   "dependencies": {
     "classnames": "^2.2.6",
-    "create-react-context": "^0.2.2",
+    "create-react-context": "^0.3.0",
     "element-resize-detector": "^1.1.12",
     "lodash.isequal": "^4.5.0",
     "memoize-one": "^5.1.1"

src/lib/Timeline.js

@@ -82,6 +82,7 @@ export default class ReactCalendarTimeline extends Component {
     itemRenderer: PropTypes.func,
     groupRenderer: PropTypes.func,
 
+    className: PropTypes.string,
     style: PropTypes.object,
 
     keys: PropTypes.shape({
@@ -208,6 +209,7 @@ export default class ReactCalendarTimeline extends Component {
     itemTouchSendsClick: false,
 
     style: {},
+    className: '',
     keys: defaultKeys,
     timeSteps: defaultTimeSteps,
     headerRef: () => {},
@@ -580,7 +582,7 @@ export default class ReactCalendarTimeline extends Component {
 
     let zoom = visibleTimeEnd - visibleTimeStart
     // can't zoom in more than to show one hour
-    if (zoom < 360000) {
+    if (zoom < this.props.minZoom) {
       return
     }
 
@@ -837,7 +839,7 @@ export default class ReactCalendarTimeline extends Component {
         itemDrag={this.dragItem}
         itemDrop={this.dropItem}
         onItemDoubleClick={this.doubleClickItem}
-        onItemContextMenu={this.contextMenuClickItem}
+        onItemContextMenu={this.props.onItemContextMenu ? this.contextMenuClickItem : undefined}
         itemResizing={this.resizingItem}
         itemResized={this.resizedItem}
         itemRenderer={this.props.itemRenderer}
@@ -1058,7 +1060,7 @@ export default class ReactCalendarTimeline extends Component {
             <div
               style={this.props.style}
               ref={el => (this.container = el)}
-              className="react-calendar-timeline"
+              className={`react-calendar-timeline ${this.props.className}`}
             >
               {this.renderHeaders()}
               <div style={outerComponentStyle} className="rct-outer">

src/lib/columns/Columns.js

@@ -73,7 +73,7 @@ class Columns extends Component {
           (firstOfType ? ' rct-vl-first' : '') +
           (minUnit === 'day' || minUnit === 'hour' || minUnit === 'minute'
             ? ` rct-day-${time.day()} `
-            : '') +
+            : ' ') +
           classNamesForTime.join(' ')
 
         const left = getLeftOffsetFromDate(time.valueOf())
@@ -112,4 +112,4 @@ ColumnsWrapper.defaultProps = {
   ...passThroughPropTypes
 }
 
-export default ColumnsWrapper
+export default ColumnsWrapper

src/lib/default-config.js

@@ -56,7 +56,13 @@ export const defaultHeaderFormats = {
     mediumLong: 'HH:mm',
     medium: 'HH:mm',
     short: 'mm',
-  }
+  },
+  second: {
+    "long": 'mm:ss',
+    mediumLong: 'mm:ss',
+    medium: 'mm:ss',
+    "short": 'ss'
+  }  
 }
 
 //TODO: delete this

src/lib/utility/dom-helpers.js

@@ -37,7 +37,7 @@ export function getSumScroll(node) {
 }
 
 export function getSumOffset(node) {
-  if (node === document.body) {
+  if (node === document.body || !node.offsetParent) {
     return {offsetLeft: 0, offsetTop: 0}
   } else {
     const parent = getSumOffset(node.offsetParent)

yarn.lock

@@ -2224,12 +2224,13 @@ create-hmac@^1.1.0, create-hmac@^1.1.2, create-hmac@^1.1.4:
     safe-buffer "^5.0.1"
     sha.js "^2.4.8"
 
-create-react-context@^0.2.2:
-  version "0.2.2"
-  resolved "https://registry.yarnpkg.com/create-react-context/-/create-react-context-0.2.2.tgz#9836542f9aaa22868cd7d4a6f82667df38019dca"
+create-react-context@^0.3.0:
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/create-react-context/-/create-react-context-0.3.0.tgz#546dede9dc422def0d3fc2fe03afe0bc0f4f7d8c"
+  integrity sha512-dNldIoSuNSvlTJ7slIKC/ZFGKexBMBrrcc+TTe1NdmROnaASuLPvqpwj9v4XS4uXZ8+YPu0sNmShX2rXI5LNsw==
   dependencies:
-    fbjs "^0.8.0"
     gud "^1.0.0"
+    warning "^4.0.3"
 
 cross-env@^5.1.4:
   version "5.1.4"
@@ -3300,18 +3301,6 @@ fb-watchman@^2.0.0:
   dependencies:
     bser "^2.0.0"
 
-fbjs@^0.8.0:
-  version "0.8.17"
-  resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd"
-  dependencies:
-    core-js "^1.0.0"
-    isomorphic-fetch "^2.1.1"
-    loose-envify "^1.0.0"
-    object-assign "^4.1.0"
-    promise "^7.1.1"
-    setimmediate "^1.0.5"
-    ua-parser-js "^0.7.18"
-
 fbjs@^0.8.16:
   version "0.8.16"
   resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.16.tgz#5e67432f550dc41b572bf55847b8aca64e5337db"
@@ -8043,10 +8032,6 @@ typescript@^2.5.1:
   version "2.6.2"
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-2.6.2.tgz#3c5b6fd7f6de0914269027f03c0946758f7673a4"
 
-ua-parser-js@^0.7.18:
-  version "0.7.18"
-  resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.18.tgz#a7bfd92f56edfb117083b69e31d2aa8882d4b1ed"
-
 ua-parser-js@^0.7.9:
   version "0.7.17"
   resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.17.tgz#e9ec5f9498b9ec910e7ae3ac626a805c4d09ecac"
@@ -8288,6 +8273,13 @@ warning@^3.0.0:
   dependencies:
     loose-envify "^1.0.0"
 
+warning@^4.0.3:
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3"
+  integrity sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==
+  dependencies:
+    loose-envify "^1.0.0"
+
 watchpack@^1.5.0:
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/watchpack/-/watchpack-1.6.0.tgz#4bc12c2ebe8aa277a71f1d3f14d685c7b446cd00"