@r365/react-calendar-timeline - npm Package Compare versions

Comparing version 0.25.0-alpha.1 to 0.25.0-alpha.17

CHANGELOG.md

@@ -0,0 +0,0 @@ # Change Log

lib/lib/headers/CustomHeader.js

@@ -49,3 +49,4 @@ 'use strict';
         timeSteps = props.timeSteps,
-        showPeriod = props.showPeriod;
+        showPeriod = props.showPeriod,
+        getLeftOffsetFromDate = props.getLeftOffsetFromDate;
 
@@ -60,3 +61,3 @@ var ratio = _this.calculateRatio(canvasWidth, canvasTimeEnd, canvasTimeStart);
       showPeriod: showPeriod,
-      ratio: ratio
+      getLeftOffsetFromDate: getLeftOffsetFromDate
     });
@@ -88,3 +89,4 @@
             timeSteps = nextProps.timeSteps,
-            showPeriod = nextProps.showPeriod;
+            showPeriod = nextProps.showPeriod,
+            getLeftOffsetFromDate = nextProps.getLeftOffsetFromDate;
 
@@ -99,3 +101,3 @@ var ratio = this.calculateRatio(canvasWidth, canvasTimeEnd, canvasTimeStart);
           showPeriod: showPeriod,
-          ratio: ratio
+          getLeftOffsetFromDate: getLeftOffsetFromDate
         });
@@ -134,3 +136,4 @@
   showPeriod: _propTypes2.default.func.isRequired,
-  props: _propTypes2.default.object
+  props: _propTypes2.default.object,
+  getLeftOffsetFromDate: _propTypes2.default.func.isRequired
 };
@@ -146,11 +149,14 @@
         timeSteps = _ref4.timeSteps,
-        ratio = _ref4.ratio;
+        getLeftOffsetFromDate = _ref4.getLeftOffsetFromDate;
 
     var intervals = [];
     (0, _calendar.iterateTimes)(canvasTimeStart, canvasTimeEnd, unit, timeSteps, function (startTime, endTime) {
-      var labelWidth = Math.ceil((endTime.valueOf() - startTime.valueOf()) * ratio);
+      var left = getLeftOffsetFromDate(startTime.valueOf());
+      var right = getLeftOffsetFromDate(endTime.valueOf());
+      var width = right - left;
       intervals.push({
         startTime: startTime,
         endTime: endTime,
-        labelWidth: labelWidth
+        labelWidth: width,
+        left: left
       });
@@ -186,3 +192,4 @@ });
     var startTime = interval.startTime,
-        labelWidth = interval.labelWidth;
+        labelWidth = interval.labelWidth,
+        left = interval.left;
 
@@ -196,3 +203,4 @@ return {
         unit: _this2.props.unit,
-        ratio: _this2.state.ratio
+        ratio: _this2.state.ratio,
+        left: left
       }),
@@ -208,11 +216,9 @@ key: 'label-' + startTime.valueOf()
         unit = _ref5.unit,
+        left = _ref5.left,
         labelWidth = _ref5.labelWidth,
         style = _ref5.style;
 
-    var left = Math.round((startTime.valueOf() - canvasTimeStart) * ratio);
-    var unitValue = startTime.get(unit === 'day' ? 'date' : unit);
-    var firstOfType = unitValue === (unit === 'day' ? 1 : 0);
-    var leftCorrect = firstOfType ? 1 : 0;
+
     return _extends({}, style, {
-      left: left - leftCorrect,
+      left: left,
       width: labelWidth,
@@ -262,3 +268,4 @@ position: 'absolute'
       var getTimelineState = _ref2.getTimelineState,
-          showPeriod = _ref2.showPeriod;
+          showPeriod = _ref2.showPeriod,
+          getLeftOffsetFromDate = _ref2.getLeftOffsetFromDate;
 
@@ -277,3 +284,4 @@ var timelineState = getTimelineState();
           }, timelineState, {
-            props: props
+            props: props,
+            getLeftOffsetFromDate: getLeftOffsetFromDate
           }));
@@ -280,0 +288,0 @@ }

lib/lib/headers/DateHeader.js

@@ -64,5 +64,4 @@ 'use strict';
         return (0, _calendar.getNextUnit)(_this.props.timelineUnit);
-      } else {
-        return _this.props.timelineUnit;
       }
+      return _this.props.timelineUnit;
     }, _this.getRootStyle = function () {
@@ -69,0 +68,0 @@ return _extends({

lib/lib/headers/HeadersContext.js

@@ -24,6 +24,2 @@ 'use strict';
 
-var _constants = require('./constants');
-
-var _calendar = require('../utility/calendar');
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -30,0 +26,0 @@

lib/lib/markers/implementations/shared.js

@@ -0,0 +0,0 @@ 'use strict';

lib/lib/markers/implementations/TodayMarker.js

@@ -0,0 +0,0 @@ 'use strict';

lib/lib/markers/MarkerCanvas.js

@@ -0,0 +0,0 @@ 'use strict';

lib/lib/Timeline.js

@@ -1045,2 +1045,2 @@ 'use strict';
 
-exports.default = ReactCalendarTimeline;
+exports.default = ReactCalendarTimeline;

lib/lib/timeline/TimelineStateContext.js

@@ -0,0 +0,0 @@ 'use strict';

lib/lib/utility/calendar.js

@@ -178,6 +178,9 @@ 'use strict';
     day: 'month',
-    month: 'year'
+    month: 'year',
+    year: 'year'
   };
-
-  return nextUnits[unit] || '';
+  if (!nextUnits[unit]) {
+    throw new Error('unit ' + unit + ' in not acceptable');
+  }
+  return nextUnits[unit];
 }
@@ -184,0 +187,0 @@

package.json

 {
   "name": "@r365/react-calendar-timeline",
-  "version": "0.25.0-alpha.1",
+  "version": "0.25.0-alpha.17",
   "description": "react calendar timeline",
@@ -130,3 +130,3 @@ "main": "lib/index.js",
     "interactjs": "^1.3.4",
-    "jest": "^23.1.0",
+    "jest": "^23.6.0",
     "jest-dom": "^1.12.1",
@@ -133,0 +133,0 @@ "jest-watch-typeahead": "^0.1.0",

README.md

@@ -241,2 +241,7 @@ # React Calendar Timeline
 
+can be assigned to 
+- false
+- space (saves space in stacking)
+- line (stack each item in a line)
+
 ## traditionalZoom
@@ -243,0 +248,0 @@

src/index.js

@@ -0,0 +0,0 @@ import Timeline from './lib/Timeline'

src/lib/columns/Columns.js

@@ -0,0 +0,0 @@ import PropTypes from 'prop-types'

src/lib/default-config.js

@@ -0,0 +0,0 @@ export const defaultKeys = {

src/lib/headers/constants.js

 export const LEFT_VARIANT= 'left'
 export const RIGHT_VARIANT= 'right'
 

src/lib/headers/CustomHeader.js

@@ -5,3 +5,3 @@ import React from 'react'
 import { TimelineStateConsumer } from '../timeline/TimelineStateContext'
-import { iterateTimes } from '../utility/calendar'
+import { iterateTimes, calculateXPositionForTime } from '../utility/calendar'
 
@@ -21,3 +21,4 @@ export class CustomHeader extends React.Component {
     showPeriod: PropTypes.func.isRequired,
-    props: PropTypes.object
+    props: PropTypes.object,
+    getLeftOffsetFromDate: PropTypes.func.isRequired,
   }
@@ -32,3 +33,4 @@ constructor(props) {
       timeSteps,
-      showPeriod
+      showPeriod,
+      getLeftOffsetFromDate,
     } = props
@@ -47,3 +49,3 @@ const ratio = this.calculateRatio(
       showPeriod,
-      ratio,
+      getLeftOffsetFromDate,
     })
@@ -87,3 +89,4 @@
         timeSteps,
-        showPeriod
+        showPeriod,
+        getLeftOffsetFromDate,
       } = nextProps
@@ -102,3 +105,3 @@ const ratio = this.calculateRatio(
         showPeriod,
-        ratio,
+        getLeftOffsetFromDate,
       })
@@ -115,3 +118,3 @@
     timeSteps,
-    ratio,
+    getLeftOffsetFromDate,
   }) => {
@@ -125,9 +128,10 @@ const intervals = []
       (startTime, endTime) => {
-        const labelWidth = Math.ceil(
-          (endTime.valueOf() - startTime.valueOf()) * ratio
-        )
+        const left = getLeftOffsetFromDate(startTime.valueOf())
+        const right = getLeftOffsetFromDate(endTime.valueOf())
+        const width = right-left
         intervals.push({
           startTime,
           endTime,
-          labelWidth
+          labelWidth: width,
+          left,
         })
@@ -158,3 +162,3 @@ }
     if (!interval) throw new Error("you should provide interval to the prop getter")
-    const { startTime, labelWidth } = interval
+    const { startTime, labelWidth, left } = interval
     return {
@@ -167,3 +171,4 @@ style: this.getIntervalStyle({
         unit: this.props.unit,
-        ratio: this.state.ratio
+        ratio: this.state.ratio,
+        left,
       }),
@@ -178,10 +183,7 @@ key: `label-${startTime.valueOf()}`
 
-  getIntervalStyle = ({ startTime, canvasTimeStart, ratio, unit, labelWidth, style, }) => {
-    const left = Math.round((startTime.valueOf() - canvasTimeStart) * ratio)
-    const unitValue = startTime.get(unit === 'day' ? 'date' : unit)
-    const firstOfType = unitValue === (unit === 'day' ? 1 : 0)
-    const leftCorrect = firstOfType ? 1 : 0
+  getIntervalStyle = ({ startTime, canvasTimeStart, ratio, unit, left,labelWidth, style, }) => {
+
     return {
       ...style,
-      left: left - leftCorrect,
+      left,
       width: labelWidth,
@@ -229,3 +231,3 @@ position: 'absolute'
   <TimelineStateConsumer>
-    {({ getTimelineState, showPeriod }) => {
+    {({ getTimelineState, showPeriod, getLeftOffsetFromDate }) => {
       const timelineState = getTimelineState()
@@ -242,2 +244,3 @@ return (
               props={props}
+              getLeftOffsetFromDate={getLeftOffsetFromDate}
             />
@@ -244,0 +247,0 @@ )}

src/lib/headers/DateHeader.js

@@ -31,5 +31,4 @@ import React from 'react'
       return getNextUnit(this.props.timelineUnit)
-    } else {
-      return this.props.timelineUnit
     }
+    return this.props.timelineUnit
   }
@@ -52,2 +51,3 @@
             <div
+            data-testid={`dateHeader`}
               className={this.props.className}
@@ -54,0 +54,0 @@ {...getRootProps({ style: this.getRootStyle() })}

src/lib/headers/HeadersContext.js

@@ -5,4 +5,2 @@ import React from 'react'
 import { noop } from '../utility/generic'
-import { LEFT_SIDEBAR_ID, RIGHT_SIDEBAR_ID } from './constants'
-import { getNextUnit } from '../utility/calendar'
 
@@ -9,0 +7,0 @@ const defaultContextState = {

src/lib/headers/Interval.js

@@ -0,0 +0,0 @@ import React from 'react'

src/lib/headers/ItemHeader.js

@@ -0,0 +0,0 @@ import React from 'react'

src/lib/headers/SidebarHeader.js

@@ -65,5 +65,5 @@ import React from 'react'
   variant: LEFT_VARIANT,
-  children: ({ getRootProps }) => <div {...getRootProps()} />
+  children: ({ getRootProps }) => <div data-testid="sidebarHeader" {...getRootProps()} />
 }
 
 export default SidebarWrapper

src/lib/headers/TimelineHeaders.js

@@ -70,3 +70,3 @@ import React from 'react'
     return (
-      <div style={this.getRootStyle()} className={this.props.className}>
+      <div data-testid="headerRootDiv" style={this.getRootStyle()} className={this.props.className}>
         {leftSidebarHeader}
@@ -77,2 +77,3 @@ <div
           className={this.props.calendarHeaderClassName}
+          data-testid="headerContainer"
         >
@@ -79,0 +80,0 @@ {calendarHeaders}

src/lib/items/defaultItemRenderer.js

@@ -0,0 +0,0 @@ import React from 'react'

src/lib/items/Items.js

@@ -0,0 +0,0 @@ import PropTypes from 'prop-types'

src/lib/items/styles.js

@@ -0,0 +0,0 @@ export const overridableStyles = {

src/lib/layout/Sidebar.js

@@ -0,0 +0,0 @@ import PropTypes from 'prop-types'

src/lib/markers/implementations/shared.js

@@ -0,0 +0,0 @@ import React from 'react'

src/lib/markers/implementations/TodayMarker.js

@@ -0,0 +0,0 @@ import React from 'react'

src/lib/markers/MarkerCanvas.js

@@ -0,0 +0,0 @@ import React from 'react'

src/lib/markers/public/CursorMarker.js

@@ -0,0 +0,0 @@ import React from 'react'

src/lib/markers/public/CustomMarker.js

@@ -0,0 +0,0 @@ import React from 'react'

src/lib/markers/public/TodayMarker.js

@@ -0,0 +0,0 @@ import React from 'react'

src/lib/markers/TimelineMarkersContext.js

@@ -0,0 +0,0 @@ import React from 'react'

src/lib/row/GroupRow.js

@@ -0,0 +0,0 @@ import React, { PureComponent } from 'react'

src/lib/row/GroupRows.js

@@ -0,0 +0,0 @@ import PropTypes from 'prop-types'

src/lib/scroll/ScrollElement.js

@@ -0,0 +0,0 @@ import React, { PureComponent } from 'react'

src/lib/Timeline.js

@@ -0,0 +0,0 @@ import PropTypes from 'prop-types'

src/lib/timeline/TimelineStateContext.js

@@ -0,0 +0,0 @@ import React from 'react'

src/lib/utility/calendar.js

@@ -152,6 +152,9 @@ import moment from 'moment'
     day: 'month',
-    month: 'year'
+    month: 'year',
+    year: 'year'
   }
-
-  return nextUnits[unit] || ''
+  if (!nextUnits[unit]) {
+    throw new Error(`unit ${unit} in not acceptable`)
+  }
+  return nextUnits[unit]
 }
@@ -177,3 +180,3 @@
   resizingEdge,
-  resizeTime
+  resizeTime,
 }) {
@@ -180,0 +183,0 @@ const originalItemRange = itemTimeEnd - itemTimeStart

src/lib/utility/dom-helpers.js

@@ -0,0 +0,0 @@ // TODO: can we use getBoundingClientRect instead??

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Lines of code

10068

increased by0.14%

Number of lines in readme file

1465

increased by0.34%

Worsened metrics

Total package byte prevSize

472764

decreased by-1.27%

No dependency changes