@pie-lib/graphing 2.11.3-next.52 → 2.11.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (90) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/lib/axis/arrow.js.map +1 -1
  3. package/lib/axis/axes.js.map +1 -1
  4. package/lib/bg.js.map +1 -1
  5. package/lib/container/actions.js.map +1 -1
  6. package/lib/container/index.js.map +1 -1
  7. package/lib/coordinates-label.js.map +1 -1
  8. package/lib/graph-with-controls.js.map +1 -1
  9. package/lib/graph.js.map +1 -1
  10. package/lib/grid-setup.js.map +1 -1
  11. package/lib/grid.js.map +1 -1
  12. package/lib/labels.js.map +1 -1
  13. package/lib/mark-label.js.map +1 -1
  14. package/lib/toggle-bar.js.map +1 -1
  15. package/lib/tool-menu.js.map +1 -1
  16. package/lib/tools/circle/bg-circle.js.map +1 -1
  17. package/lib/tools/circle/component.js.map +1 -1
  18. package/lib/tools/circle/index.js.map +1 -1
  19. package/lib/tools/index.js.map +1 -1
  20. package/lib/tools/line/component.js.map +1 -1
  21. package/lib/tools/parabola/component.js.map +1 -1
  22. package/lib/tools/parabola/index.js.map +1 -1
  23. package/lib/tools/point/component.js.map +1 -1
  24. package/lib/tools/point/index.js.map +1 -1
  25. package/lib/tools/polygon/component.js.map +1 -1
  26. package/lib/tools/polygon/index.js.map +1 -1
  27. package/lib/tools/polygon/line.js.map +1 -1
  28. package/lib/tools/polygon/polygon.js.map +1 -1
  29. package/lib/tools/ray/component.js.map +1 -1
  30. package/lib/tools/segment/component.js.map +1 -1
  31. package/lib/tools/shared/arrow-head.js.map +1 -1
  32. package/lib/tools/shared/line/index.js.map +1 -1
  33. package/lib/tools/shared/line/line-path.js.map +1 -1
  34. package/lib/tools/shared/line/with-root-edge.js.map +1 -1
  35. package/lib/tools/shared/point/arrow-point.js.map +1 -1
  36. package/lib/tools/shared/point/arrow.js.map +1 -1
  37. package/lib/tools/shared/point/base-point.js.map +1 -1
  38. package/lib/tools/shared/point/index.js.map +1 -1
  39. package/lib/tools/shared/styles.js.map +1 -1
  40. package/lib/tools/shared/types.js.map +1 -1
  41. package/lib/tools/sine/component.js.map +1 -1
  42. package/lib/tools/sine/index.js.map +1 -1
  43. package/lib/tools/vector/component.js.map +1 -1
  44. package/lib/undo-redo.js.map +1 -1
  45. package/lib/utils.js.map +1 -1
  46. package/package.json +6 -6
  47. package/src/axis/arrow.jsx +4 -4
  48. package/src/axis/axes.jsx +34 -56
  49. package/src/bg.jsx +3 -11
  50. package/src/container/actions.js +3 -3
  51. package/src/container/index.jsx +7 -7
  52. package/src/coordinates-label.jsx +8 -8
  53. package/src/graph-with-controls.jsx +30 -41
  54. package/src/graph.jsx +20 -22
  55. package/src/grid-setup.jsx +37 -64
  56. package/src/grid.jsx +17 -19
  57. package/src/labels.jsx +20 -20
  58. package/src/mark-label.jsx +13 -13
  59. package/src/toggle-bar.jsx +28 -30
  60. package/src/tool-menu.jsx +7 -12
  61. package/src/tools/circle/bg-circle.jsx +11 -26
  62. package/src/tools/circle/component.jsx +25 -25
  63. package/src/tools/circle/index.js +2 -2
  64. package/src/tools/index.js +2 -23
  65. package/src/tools/line/component.jsx +5 -10
  66. package/src/tools/parabola/component.jsx +2 -9
  67. package/src/tools/parabola/index.js +2 -2
  68. package/src/tools/point/component.jsx +5 -5
  69. package/src/tools/point/index.js +3 -3
  70. package/src/tools/polygon/component.jsx +18 -34
  71. package/src/tools/polygon/index.js +3 -3
  72. package/src/tools/polygon/line.jsx +10 -15
  73. package/src/tools/polygon/polygon.jsx +16 -25
  74. package/src/tools/ray/component.jsx +5 -10
  75. package/src/tools/segment/component.jsx +5 -10
  76. package/src/tools/shared/arrow-head.jsx +4 -4
  77. package/src/tools/shared/line/index.jsx +30 -31
  78. package/src/tools/shared/line/line-path.jsx +13 -29
  79. package/src/tools/shared/line/with-root-edge.jsx +14 -25
  80. package/src/tools/shared/point/arrow-point.jsx +6 -25
  81. package/src/tools/shared/point/arrow.jsx +3 -21
  82. package/src/tools/shared/point/base-point.jsx +3 -11
  83. package/src/tools/shared/point/index.jsx +11 -11
  84. package/src/tools/shared/styles.js +3 -3
  85. package/src/tools/shared/types.js +1 -1
  86. package/src/tools/sine/component.jsx +2 -2
  87. package/src/tools/sine/index.js +2 -2
  88. package/src/tools/vector/component.jsx +5 -10
  89. package/src/undo-redo.jsx +6 -6
  90. package/src/utils.js +29 -38
@@ -6,7 +6,7 @@ const log = debug('pie-lib:graphing:sine');
6
6
 
7
7
  log('sine...');
8
8
 
9
- const Sine = withRootEdge(props => {
9
+ const Sine = withRootEdge((props) => {
10
10
  const { domain } = props.graphProps;
11
11
 
12
12
  const { root, edge } = props;
@@ -23,7 +23,7 @@ const Sine = withRootEdge(props => {
23
23
  root,
24
24
  edge,
25
25
  interval,
26
- sinY(amplitude, freq, { phase: root.x, vertical: root.y })
26
+ sinY(amplitude, freq, { phase: root.x, vertical: root.y }),
27
27
  );
28
28
  return { root: props.root, edge: props.edge, dataPoints };
29
29
  });
@@ -22,12 +22,12 @@ export const tool = () => ({
22
22
  root: point,
23
23
  edge: undefined,
24
24
  closed: false,
25
- building: true
25
+ building: true,
26
26
  };
27
27
  } else if (mark && !mark.root) {
28
28
  throw new Error('no root - should never happen');
29
29
  } else {
30
30
  return { ...mark, edge: point, closed: true, building: false };
31
31
  }
32
- }
32
+ },
33
33
  });
@@ -7,14 +7,14 @@ import classNames from 'classnames';
7
7
  import { withStyles } from '@material-ui/core/styles';
8
8
  import { getDistanceBetweenTwoPoints } from '../../utils';
9
9
 
10
- const lineStyles = theme => ({
10
+ const lineStyles = (theme) => ({
11
11
  line: styles.line(theme),
12
12
  disabled: styles.disabled(theme),
13
13
  correct: styles.correct(theme, 'stroke'),
14
- incorrect: styles.incorrect(theme, 'stroke')
14
+ incorrect: styles.incorrect(theme, 'stroke'),
15
15
  });
16
16
 
17
- export const Line = props => {
17
+ export const Line = (props) => {
18
18
  const {
19
19
  className,
20
20
  classes,
@@ -31,12 +31,7 @@ export const Line = props => {
31
31
 
32
32
  return (
33
33
  <line
34
- className={classNames(
35
- classes.line,
36
- disabled && classes.disabled,
37
- classes[correctness],
38
- className
39
- )}
34
+ className={classNames(classes.line, disabled && classes.disabled, classes[correctness], className)}
40
35
  x1={startPoint.x}
41
36
  y1={startPoint.y}
42
37
  x2={endPoint.x}
@@ -54,7 +49,7 @@ Line.propTypes = {
54
49
  correctness: PropTypes.string,
55
50
  graphProps: PropTypes.any,
56
51
  from: types.PointType,
57
- to: types.PointType
52
+ to: types.PointType,
58
53
  };
59
54
 
60
55
  const StyledLine = withStyles(lineStyles)(Line);
package/src/undo-redo.jsx CHANGED
@@ -11,7 +11,7 @@ export class UndoRedo extends React.Component {
11
11
  className: PropTypes.string,
12
12
  onUndo: PropTypes.func.isRequired,
13
13
  onRedo: PropTypes.func.isRequired,
14
- onReset: PropTypes.func.isRequired
14
+ onReset: PropTypes.func.isRequired,
15
15
  };
16
16
  static defaultProps = {};
17
17
  render() {
@@ -32,18 +32,18 @@ export class UndoRedo extends React.Component {
32
32
  }
33
33
  }
34
34
 
35
- const styles = theme => ({
35
+ const styles = (theme) => ({
36
36
  button: {
37
37
  color: color.text(),
38
38
  backgroundColor: color.background(),
39
39
  marginBottom: theme.spacing.unit / 2,
40
40
  '&:not(:last-of-type)': {
41
- marginRight: theme.spacing.unit / 2
41
+ marginRight: theme.spacing.unit / 2,
42
42
  },
43
43
  '&:hover': {
44
- backgroundColor: color.primary()
45
- }
46
- }
44
+ backgroundColor: color.primary(),
45
+ },
46
+ },
47
47
  });
48
48
 
49
49
  export default withStyles(styles)(UndoRedo);
package/src/utils.js CHANGED
@@ -15,7 +15,7 @@ export const getAngleDeg = () => 0;
15
15
  //TODO: This can be removed?
16
16
  export const arrowDimensions = () => 0;
17
17
 
18
- export const getTickValues = prop => {
18
+ export const getTickValues = (prop) => {
19
19
  const tickValues = [];
20
20
  let tickVal = 0;
21
21
 
@@ -33,13 +33,13 @@ export const getTickValues = prop => {
33
33
 
34
34
  // return only ticks that are inside the min-max interval
35
35
  if (tickValues) {
36
- return tickValues.filter(tV => tV >= prop.min && tV <= prop.max);
36
+ return tickValues.filter((tV) => tV >= prop.min && tV <= prop.max);
37
37
  }
38
38
 
39
39
  return [];
40
40
  };
41
41
 
42
- export const countWords = label => {
42
+ export const countWords = (label) => {
43
43
  if (label == null || isEmpty(label)) {
44
44
  return 1;
45
45
  }
@@ -49,7 +49,7 @@ export const countWords = label => {
49
49
  };
50
50
 
51
51
  // findLongestWord is also used in plot
52
- export const findLongestWord = label => {
52
+ export const findLongestWord = (label) => {
53
53
  let longestWord = (label || '')
54
54
  .replace(/<[^>]+>/g, '')
55
55
  .split(' ')
@@ -59,7 +59,7 @@ export const findLongestWord = label => {
59
59
  };
60
60
 
61
61
  // amountToIncreaseWidth is also used in plot
62
- export const amountToIncreaseWidth = longestWord => {
62
+ export const amountToIncreaseWidth = (longestWord) => {
63
63
  if (!longestWord) {
64
64
  return 0;
65
65
  }
@@ -67,13 +67,13 @@ export const amountToIncreaseWidth = longestWord => {
67
67
  return longestWord * 10;
68
68
  };
69
69
 
70
- export const polygonToArea = points => {
70
+ export const polygonToArea = (points) => {
71
71
  const h = head(points);
72
72
  const area = {
73
73
  left: h.x,
74
74
  top: h.y,
75
75
  bottom: h.y,
76
- right: h.x
76
+ right: h.x,
77
77
  };
78
78
  return tail(points).reduce((a, p) => {
79
79
  a.left = Math.min(a.left, p.x);
@@ -96,13 +96,10 @@ export const pointsToArea = (a, b) => {
96
96
  };
97
97
 
98
98
  export const isDomainRangeEqual = (graphProps, nextGraphProps) => {
99
- return (
100
- isEqual(graphProps.domain, nextGraphProps.domain) &&
101
- isEqual(graphProps.range, nextGraphProps.range)
102
- );
99
+ return isEqual(graphProps.domain, nextGraphProps.domain) && isEqual(graphProps.range, nextGraphProps.range);
103
100
  };
104
101
 
105
- export const getRightestPoints = points => {
102
+ export const getRightestPoints = (points) => {
106
103
  const sortedPoints = cloneDeep(points);
107
104
  sortedPoints.sort((a, b) => b.x - a.x);
108
105
 
@@ -111,10 +108,10 @@ export const getRightestPoints = points => {
111
108
 
112
109
  export const getMiddleOfTwoPoints = (a, b) => ({
113
110
  x: (a.x + b.x) / 2,
114
- y: (a.y + b.y) / 2
111
+ y: (a.y + b.y) / 2,
115
112
  });
116
113
 
117
- export const roundNumber = number => parseFloat(number.toFixed(4));
114
+ export const roundNumber = (number) => parseFloat(number.toFixed(4));
118
115
 
119
116
  export const sameAxes = (p1, p2) =>
120
117
  p1 && p2 && (roundNumber(p1.x) === roundNumber(p2.x) || roundNumber(p1.y) === roundNumber(p2.y));
@@ -125,12 +122,12 @@ export const equalPoints = (p1, p2) =>
125
122
  isEqual(
126
123
  {
127
124
  x: roundNumber(p1.x),
128
- y: roundNumber(p1.y)
125
+ y: roundNumber(p1.y),
129
126
  },
130
127
  {
131
128
  x: roundNumber(p2.x),
132
- y: roundNumber(p2.y)
133
- }
129
+ y: roundNumber(p2.y),
130
+ },
134
131
  );
135
132
 
136
133
  const getDistanceBetweenTicks = (axis, size) => {
@@ -140,22 +137,22 @@ const getDistanceBetweenTicks = (axis, size) => {
140
137
  return size / nbOfTicks;
141
138
  };
142
139
 
143
- export const thinnerShapesNeeded = graphProps => {
140
+ export const thinnerShapesNeeded = (graphProps) => {
144
141
  const {
145
142
  domain,
146
143
  range,
147
- size: { width, height }
144
+ size: { width, height },
148
145
  } = graphProps;
149
146
 
150
147
  // 14 is the default width of a point
151
148
  return getDistanceBetweenTicks(domain, width) < 14 || getDistanceBetweenTicks(range, height) < 14;
152
149
  };
153
150
 
154
- export const getAdjustedGraphLimits = graphProps => {
151
+ export const getAdjustedGraphLimits = (graphProps) => {
155
152
  const {
156
153
  domain,
157
154
  range,
158
- size: { width, height }
155
+ size: { width, height },
159
156
  } = graphProps;
160
157
  const domainTicksDistance = getDistanceBetweenTicks(domain, width);
161
158
  const rangeTicksDistance = getDistanceBetweenTicks(range, height);
@@ -167,32 +164,29 @@ export const getAdjustedGraphLimits = graphProps => {
167
164
  return {
168
165
  domain: {
169
166
  min: domain.min - domainPadding,
170
- max: domain.max + domainPadding
167
+ max: domain.max + domainPadding,
171
168
  },
172
169
  range: {
173
170
  min: range.min - rangePadding,
174
- max: range.max + rangePadding
175
- }
171
+ max: range.max + rangePadding,
172
+ },
176
173
  };
177
174
  };
178
175
 
179
- export const getDistanceBetweenTwoPoints = (a, b) =>
180
- Math.sqrt((b.x - a.x) * (b.x - a.x) + (b.y - a.y) * (b.y - a.y));
176
+ export const getDistanceBetweenTwoPoints = (a, b) => Math.sqrt((b.x - a.x) * (b.x - a.x) + (b.y - a.y) * (b.y - a.y));
181
177
 
182
- const sortPoints = array => (array || []).sort((a, b) => a.x - b.x || a.y - b.y);
178
+ const sortPoints = (array) => (array || []).sort((a, b) => a.x - b.x || a.y - b.y);
183
179
 
184
180
  // check colliniarity of 3 points (source: https://www.geeksforgeeks.org/program-check-three-points-collinear/)
185
181
  const checkCollinearity = (a, b, c) => (a.x - b.x) * (c.y - b.y) === (c.x - b.x) * (a.y - b.y);
186
182
 
187
183
  // 2 lines are overlapping if all 4 points are collinear
188
184
  const isSameLine = (markA, markB) =>
189
- checkCollinearity(markA.from, markB.from, markB.to) &&
190
- checkCollinearity(markA.to, markB.from, markB.to);
185
+ checkCollinearity(markA.from, markB.from, markB.to) && checkCollinearity(markA.to, markB.from, markB.to);
191
186
 
192
187
  const isSameCircle = (markA, markB) =>
193
188
  equalPoints(markA.root, markB.root) &&
194
- getDistanceBetweenTwoPoints(markB.root, markB.edge) ===
195
- getDistanceBetweenTwoPoints(markA.root, markA.edge);
189
+ getDistanceBetweenTwoPoints(markB.root, markB.edge) === getDistanceBetweenTwoPoints(markA.root, markA.edge);
196
190
 
197
191
  export const isDuplicatedMark = (mark, marks, oldMark) => {
198
192
  const { type, building } = mark;
@@ -201,21 +195,18 @@ export const isDuplicatedMark = (mark, marks, oldMark) => {
201
195
  return false;
202
196
  }
203
197
 
204
- const filteredMarks = (marks || []).filter(m => m.type === type && !m.building);
205
- const index = filteredMarks.findIndex(m => isEqual(m, oldMark));
198
+ const filteredMarks = (marks || []).filter((m) => m.type === type && !m.building);
199
+ const index = filteredMarks.findIndex((m) => isEqual(m, oldMark));
206
200
 
207
201
  if (index !== -1) {
208
202
  filteredMarks.splice(index, 1);
209
203
  }
210
204
 
211
- const duplicated = filteredMarks.find(m => {
205
+ const duplicated = filteredMarks.find((m) => {
212
206
  if (type === 'circle' || type === 'parabola' || type === 'sine') {
213
207
  const { root, edge } = mark;
214
208
 
215
- return (
216
- (equalPoints(root, m.root) && equalPoints(edge, m.edge)) ||
217
- (type === 'circle' && isSameCircle(m, mark))
218
- );
209
+ return (equalPoints(root, m.root) && equalPoints(edge, m.edge)) || (type === 'circle' && isSameCircle(m, mark));
219
210
  } else if (type === 'line' || type === 'ray' || type === 'segment' || type === 'vector') {
220
211
  const { from, to } = mark;
221
212