@pie-lib/graphing 2.14.22-next.0 → 2.14.22-next.1618

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 (194) hide show
  1. package/CHANGELOG.json +1 -1017
  2. package/CHANGELOG.md +159 -24
  3. package/NEXT.CHANGELOG.json +1 -0
  4. package/lib/axis/axes.js +5 -5
  5. package/lib/axis/axes.js.map +1 -1
  6. package/lib/container/index.js +1 -4
  7. package/lib/container/index.js.map +1 -1
  8. package/lib/coordinates-label.js +5 -3
  9. package/lib/coordinates-label.js.map +1 -1
  10. package/lib/graph-with-controls.js +8 -15
  11. package/lib/graph-with-controls.js.map +1 -1
  12. package/lib/graph.js +29 -12
  13. package/lib/graph.js.map +1 -1
  14. package/lib/grid.js +6 -14
  15. package/lib/grid.js.map +1 -1
  16. package/lib/index.js +8 -0
  17. package/lib/index.js.map +1 -1
  18. package/lib/key-legend.js +246 -0
  19. package/lib/key-legend.js.map +1 -0
  20. package/lib/label-svg-icon.js +56 -0
  21. package/lib/label-svg-icon.js.map +1 -0
  22. package/lib/labels.js +2 -1
  23. package/lib/labels.js.map +1 -1
  24. package/lib/mark-label.js +167 -56
  25. package/lib/mark-label.js.map +1 -1
  26. package/lib/toggle-bar.js +3 -4
  27. package/lib/toggle-bar.js.map +1 -1
  28. package/lib/tool-menu.js +2 -22
  29. package/lib/tool-menu.js.map +1 -1
  30. package/lib/tools/absolute/component.js +35 -0
  31. package/lib/tools/absolute/component.js.map +1 -0
  32. package/lib/tools/absolute/index.js +63 -0
  33. package/lib/tools/absolute/index.js.map +1 -0
  34. package/lib/tools/circle/bg-circle.js +4 -3
  35. package/lib/tools/circle/bg-circle.js.map +1 -1
  36. package/lib/tools/circle/component.js +34 -15
  37. package/lib/tools/circle/component.js.map +1 -1
  38. package/lib/tools/exponential/component.js +34 -0
  39. package/lib/tools/exponential/component.js.map +1 -0
  40. package/lib/tools/exponential/index.js +71 -0
  41. package/lib/tools/exponential/index.js.map +1 -0
  42. package/lib/tools/index.js +26 -6
  43. package/lib/tools/index.js.map +1 -1
  44. package/lib/tools/line/component.js +2 -1
  45. package/lib/tools/line/component.js.map +1 -1
  46. package/lib/tools/parabola/component.js +6 -5
  47. package/lib/tools/parabola/component.js.map +1 -1
  48. package/lib/tools/point/component.js +14 -9
  49. package/lib/tools/point/component.js.map +1 -1
  50. package/lib/tools/polygon/component.js +25 -12
  51. package/lib/tools/polygon/component.js.map +1 -1
  52. package/lib/tools/polygon/line.js +12 -6
  53. package/lib/tools/polygon/line.js.map +1 -1
  54. package/lib/tools/polygon/polygon.js +6 -3
  55. package/lib/tools/polygon/polygon.js.map +1 -1
  56. package/lib/tools/ray/component.js +2 -1
  57. package/lib/tools/ray/component.js.map +1 -1
  58. package/lib/tools/segment/component.js +2 -1
  59. package/lib/tools/segment/component.js.map +1 -1
  60. package/lib/tools/shared/icons/CorrectSVG.js +36 -0
  61. package/lib/tools/shared/icons/CorrectSVG.js.map +1 -0
  62. package/lib/tools/shared/icons/IncorrectSVG.js +36 -0
  63. package/lib/tools/shared/icons/IncorrectSVG.js.map +1 -0
  64. package/lib/tools/shared/icons/MissingSVG.js +35 -0
  65. package/lib/tools/shared/icons/MissingSVG.js.map +1 -0
  66. package/lib/tools/shared/line/index.js +51 -19
  67. package/lib/tools/shared/line/index.js.map +1 -1
  68. package/lib/tools/shared/line/line-path.js +13 -7
  69. package/lib/tools/shared/line/line-path.js.map +1 -1
  70. package/lib/tools/shared/line/with-root-edge.js +19 -8
  71. package/lib/tools/shared/line/with-root-edge.js.map +1 -1
  72. package/lib/tools/shared/point/arrow-point.js +1 -1
  73. package/lib/tools/shared/point/arrow-point.js.map +1 -1
  74. package/lib/tools/shared/point/arrow.js +1 -1
  75. package/lib/tools/shared/point/arrow.js.map +1 -1
  76. package/lib/tools/shared/point/base-point.js +43 -7
  77. package/lib/tools/shared/point/base-point.js.map +1 -1
  78. package/lib/tools/shared/point/index.js +4 -1
  79. package/lib/tools/shared/point/index.js.map +1 -1
  80. package/lib/tools/shared/styles.js +16 -7
  81. package/lib/tools/shared/styles.js.map +1 -1
  82. package/lib/tools/sine/component.js +13 -4
  83. package/lib/tools/sine/component.js.map +1 -1
  84. package/lib/tools/vector/component.js +2 -1
  85. package/lib/tools/vector/component.js.map +1 -1
  86. package/lib/undo-redo.js +0 -1
  87. package/lib/undo-redo.js.map +1 -1
  88. package/lib/utils.js +1 -1
  89. package/lib/utils.js.map +1 -1
  90. package/package.json +12 -7
  91. package/src/__tests__/__snapshots__/graph-with-controls.test.jsx.snap +237 -0
  92. package/src/__tests__/__snapshots__/graph.test.jsx.snap +211 -0
  93. package/src/__tests__/__snapshots__/grid.test.jsx.snap +54 -0
  94. package/src/__tests__/__snapshots__/labels.test.jsx.snap +30 -0
  95. package/src/__tests__/__snapshots__/mark-label.test.jsx.snap +45 -0
  96. package/src/__tests__/__snapshots__/toggle-bar.test.jsx.snap +7 -0
  97. package/src/__tests__/__snapshots__/tool-menu.test.jsx.snap +13 -0
  98. package/src/__tests__/__snapshots__/undo-redo.test.jsx.snap +14 -0
  99. package/src/__tests__/graph-with-controls.test.jsx +147 -0
  100. package/src/__tests__/graph.test.jsx +230 -0
  101. package/src/__tests__/grid.test.jsx +20 -0
  102. package/src/__tests__/labels.test.jsx +38 -0
  103. package/src/__tests__/mark-label.test.jsx +68 -0
  104. package/src/__tests__/toggle-bar.test.jsx +36 -0
  105. package/src/__tests__/tool-menu.test.jsx +29 -0
  106. package/src/__tests__/undo-redo.test.jsx +25 -0
  107. package/src/__tests__/use-debounce.test.js +21 -0
  108. package/src/__tests__/utils.js +38 -0
  109. package/src/__tests__/utils.test.js +151 -0
  110. package/src/axis/__tests__/__snapshots__/arrow.test.jsx.snap +33 -0
  111. package/src/axis/__tests__/__snapshots__/axes.test.jsx.snap +122 -0
  112. package/src/axis/__tests__/arrow.test.jsx +39 -0
  113. package/src/axis/__tests__/axes.test.jsx +220 -0
  114. package/src/axis/axes.jsx +5 -5
  115. package/src/container/index.jsx +2 -4
  116. package/src/coordinates-label.jsx +4 -3
  117. package/src/graph-with-controls.jsx +8 -10
  118. package/src/graph.jsx +22 -10
  119. package/src/grid.jsx +8 -10
  120. package/src/index.js +2 -2
  121. package/src/key-legend.jsx +145 -0
  122. package/src/label-svg-icon.jsx +39 -0
  123. package/src/labels.jsx +2 -1
  124. package/src/mark-label.jsx +149 -52
  125. package/src/toggle-bar.jsx +1 -2
  126. package/src/tool-menu.jsx +3 -26
  127. package/src/tools/absolute/__tests__/component.test.jsx +54 -0
  128. package/src/tools/absolute/component.jsx +23 -0
  129. package/src/tools/absolute/index.js +31 -0
  130. package/src/tools/circle/__tests__/__snapshots__/bg-circle.test.jsx.snap +46 -0
  131. package/src/tools/circle/__tests__/__snapshots__/component.test.jsx.snap +293 -0
  132. package/src/tools/circle/__tests__/bg-circle.test.jsx +28 -0
  133. package/src/tools/circle/__tests__/component.test.jsx +228 -0
  134. package/src/tools/circle/bg-circle.jsx +5 -4
  135. package/src/tools/circle/component.jsx +22 -8
  136. package/src/tools/exponential/__tests__/component.test.jsx +54 -0
  137. package/src/tools/exponential/component.jsx +23 -0
  138. package/src/tools/exponential/index.js +39 -0
  139. package/src/tools/index.js +38 -5
  140. package/src/tools/line/__tests__/__snapshots__/component.test.jsx.snap +20 -0
  141. package/src/tools/line/__tests__/component.test.jsx +36 -0
  142. package/src/tools/line/component.jsx +2 -1
  143. package/src/tools/parabola/__tests__/component.test.jsx +49 -0
  144. package/src/tools/parabola/component.jsx +7 -6
  145. package/src/tools/point/__tests__/__snapshots__/component.test.jsx.snap +40 -0
  146. package/src/tools/point/__tests__/component.test.jsx +66 -0
  147. package/src/tools/point/component.jsx +12 -6
  148. package/src/tools/polygon/__tests__/__snapshots__/component.test.jsx.snap +415 -0
  149. package/src/tools/polygon/__tests__/__snapshots__/line.test.jsx.snap +45 -0
  150. package/src/tools/polygon/__tests__/__snapshots__/polygon.test.jsx.snap +52 -0
  151. package/src/tools/polygon/__tests__/component.test.jsx +226 -0
  152. package/src/tools/polygon/__tests__/index.test.js +65 -0
  153. package/src/tools/polygon/__tests__/line.test.jsx +25 -0
  154. package/src/tools/polygon/__tests__/polygon.test.jsx +44 -0
  155. package/src/tools/polygon/component.jsx +39 -11
  156. package/src/tools/polygon/line.jsx +15 -7
  157. package/src/tools/polygon/polygon.jsx +7 -3
  158. package/src/tools/ray/__tests__/__snapshots__/component.test.jsx.snap +23 -0
  159. package/src/tools/ray/__tests__/component.test.jsx +29 -0
  160. package/src/tools/ray/component.jsx +2 -1
  161. package/src/tools/segment/__tests__/__snapshots__/component.test.jsx.snap +14 -0
  162. package/src/tools/segment/__tests__/component.test.jsx +28 -0
  163. package/src/tools/segment/component.jsx +2 -1
  164. package/src/tools/shared/__tests__/__snapshots__/arrow-head.test.jsx.snap +27 -0
  165. package/src/tools/shared/__tests__/arrow-head.test.jsx +34 -0
  166. package/src/tools/shared/icons/CorrectSVG.jsx +22 -0
  167. package/src/tools/shared/icons/IncorrectSVG.jsx +20 -0
  168. package/src/tools/shared/icons/MissingSVG.jsx +21 -0
  169. package/src/tools/shared/line/__tests__/__snapshots__/index.test.jsx.snap +360 -0
  170. package/src/tools/shared/line/__tests__/__snapshots__/line-path.test.jsx.snap +58 -0
  171. package/src/tools/shared/line/__tests__/__snapshots__/with-root-edge.test.jsx.snap +63 -0
  172. package/src/tools/shared/line/__tests__/index.test.jsx +255 -0
  173. package/src/tools/shared/line/__tests__/line-path.test.jsx +53 -0
  174. package/src/tools/shared/line/__tests__/with-root-edge.test.jsx +73 -0
  175. package/src/tools/shared/line/index.jsx +39 -13
  176. package/src/tools/shared/line/line-path.jsx +18 -7
  177. package/src/tools/shared/line/with-root-edge.jsx +10 -3
  178. package/src/tools/shared/point/__tests__/__snapshots__/arrow-point.test.jsx.snap +56 -0
  179. package/src/tools/shared/point/__tests__/__snapshots__/base-point.test.jsx.snap +44 -0
  180. package/src/tools/shared/point/__tests__/arrow-point.test.jsx +87 -0
  181. package/src/tools/shared/point/__tests__/base-point.test.jsx +84 -0
  182. package/src/tools/shared/point/arrow-point.jsx +4 -1
  183. package/src/tools/shared/point/arrow.jsx +4 -1
  184. package/src/tools/shared/point/base-point.jsx +28 -3
  185. package/src/tools/shared/point/index.jsx +7 -2
  186. package/src/tools/shared/styles.js +8 -3
  187. package/src/tools/sine/__tests__/component.test.jsx +51 -0
  188. package/src/tools/sine/component.jsx +7 -7
  189. package/src/tools/vector/__tests__/__snapshots__/component.test.jsx.snap +12 -0
  190. package/src/tools/vector/__tests__/component.test.jsx +26 -0
  191. package/src/tools/vector/component.jsx +2 -1
  192. package/src/undo-redo.jsx +0 -1
  193. package/src/utils.js +1 -1
  194. package/legacy.png +0 -0
package/lib/mark-label.js CHANGED
@@ -9,10 +9,10 @@ Object.defineProperty(exports, "__esModule", {
9
9
  });
10
10
  exports.position = exports["default"] = exports.coordinates = exports.MarkLabel = void 0;
11
11
 
12
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
13
-
14
12
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
15
13
 
14
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
15
+
16
16
  var _react = _interopRequireWildcard(require("react"));
17
17
 
18
18
  var _classnames = _interopRequireDefault(require("classnames"));
@@ -29,6 +29,8 @@ var _plot = require("@pie-lib/plot");
29
29
 
30
30
  var _renderUi = require("@pie-lib/render-ui");
31
31
 
32
+ var _labelSvgIcon = _interopRequireDefault(require("./label-svg-icon"));
33
+
32
34
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
33
35
 
34
36
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -37,38 +39,74 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
37
39
 
38
40
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
39
41
 
42
+ var inputStyles = function inputStyles(theme) {
43
+ return {
44
+ "float": 'right',
45
+ padding: theme.spacing.unit * 0.5,
46
+ borderRadius: '4px',
47
+ fontSize: '10px',
48
+ backgroundColor: _renderUi.color.defaults.WHITE
49
+ };
50
+ };
51
+
40
52
  var styles = function styles(theme) {
41
53
  return {
54
+ inputStudent: _objectSpread(_objectSpread({}, inputStyles(theme)), {}, {
55
+ padding: '0',
56
+ border: 'none',
57
+ color: 'inherit',
58
+ fontWeight: 'bold'
59
+ }),
42
60
  input: {
43
61
  "float": 'right',
44
62
  padding: theme.spacing.unit * 0.5,
45
63
  fontFamily: theme.typography.fontFamily,
46
- fontSize: theme.typography.fontSize,
47
- border: "solid 1px ".concat(_renderUi.color.secondary()),
64
+ fontSize: '10px',
65
+ border: "solid 1px ".concat(_renderUi.color.defaults.SECONDARY),
48
66
  borderRadius: '3px',
49
- color: _renderUi.color.primaryDark()
67
+ color: _renderUi.color.defaults.PRIMARY_DARK,
68
+ backgroundColor: _renderUi.color.defaults.WHITE
50
69
  },
51
70
  disabled: {
52
- border: "solid 1px ".concat(_renderUi.color.primaryDark()),
53
- background: theme.palette.background.paper
71
+ border: "solid 1px ".concat(_renderUi.color.defaults.PRIMARY_DARK),
72
+ backgroundColor: _renderUi.color.defaults.WHITE,
73
+ '-webkit-opacity': '1'
54
74
  },
55
75
  disabledMark: {
56
76
  border: "solid 1px ".concat(_renderUi.color.disabled()),
57
- background: theme.palette.background.paper,
58
- color: _renderUi.color.disabled()
59
- }
77
+ color: _renderUi.color.disabled(),
78
+ '-webkit-text-fill-color': _renderUi.color.disabled()
79
+ },
80
+ inputCorrect: _objectSpread(_objectSpread({}, inputStyles(theme)), {}, {
81
+ color: _renderUi.color.defaults.CORRECT_WITH_ICON,
82
+ border: "solid 1px ".concat(_renderUi.color.defaults.CORRECT_WITH_ICON)
83
+ }),
84
+ inputIncorrect: _objectSpread(_objectSpread({}, inputStyles(theme)), {}, {
85
+ color: _renderUi.color.defaults.INCORRECT_WITH_ICON,
86
+ border: "solid 1px ".concat(_renderUi.color.defaults.INCORRECT_WITH_ICON)
87
+ }),
88
+ inputMissing: _objectSpread(_objectSpread({}, inputStyles(theme)), {}, {
89
+ color: _renderUi.color.defaults.MISSING_WITH_ICON,
90
+ border: "solid 1px ".concat(_renderUi.color.defaults.MISSING_WITH_ICON),
91
+ fontWeight: 'bold'
92
+ }),
93
+ incorrect: _objectSpread(_objectSpread({}, inputStyles(theme)), {}, {
94
+ color: _renderUi.color.defaults.INCORRECT_WITH_ICON,
95
+ fontWeight: 'bold',
96
+ padding: '0'
97
+ })
60
98
  };
61
99
  };
62
100
 
63
- var position = function position(graphProps, mark, rect) {
64
- rect = rect || {
101
+ var position = function position(graphProps, mark) {
102
+ var rect = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
65
103
  width: 0,
66
104
  height: 0
67
105
  };
68
106
  var scale = graphProps.scale,
69
107
  domain = graphProps.domain,
70
108
  range = graphProps.range;
71
- var shift = 10;
109
+ var shift = 5;
72
110
  var rightEdge = scale.x(mark.x) + rect.width + shift;
73
111
  var bottomEdge = scale.y(mark.y) + rect.height + shift;
74
112
  var h = rightEdge >= scale.x(domain.max) ? 'left' : 'right';
@@ -78,52 +116,67 @@ var position = function position(graphProps, mark, rect) {
78
116
 
79
117
  exports.position = position;
80
118
 
81
- var coordinates = function coordinates(graphProps, mark, rect, position, fontSize) {
82
- var scale = graphProps.scale;
83
- var shift = 10;
84
- var font = fontSize ? fontSize : 16;
85
- rect = rect || {
119
+ var coordinates = function coordinates(graphProps, mark) {
120
+ var rect = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
86
121
  width: 0,
87
122
  height: 0
88
123
  };
124
+ var position = arguments.length > 3 ? arguments[3] : undefined;
125
+ var scale = graphProps.scale;
126
+ var shift = 5;
89
127
 
90
128
  switch (position) {
91
129
  case 'bottom-right':
92
- {
93
- return {
94
- left: "".concat((scale.x(mark.x) + shift) / font, "rem"),
95
- top: "".concat((scale.y(mark.y) + shift) / font, "rem")
96
- };
97
- }
130
+ return {
131
+ left: scale.x(mark.x) + shift,
132
+ top: scale.y(mark.y) + shift
133
+ };
98
134
 
99
135
  case 'bottom-left':
100
- {
101
- return {
102
- left: "".concat((scale.x(mark.x) - shift - rect.width) / font, "rem"),
103
- top: "".concat((scale.y(mark.y) + shift) / font, "rem")
104
- };
105
- }
136
+ return {
137
+ left: scale.x(mark.x) - shift - rect.width,
138
+ top: scale.y(mark.y) + shift
139
+ };
106
140
 
107
141
  case 'top-left':
108
- {
109
- return {
110
- left: "".concat((scale.x(mark.x) - shift - rect.width) / font, "rem"),
111
- top: "".concat((scale.y(mark.y) - shift - rect.height) / font, "rem")
112
- };
113
- }
142
+ return {
143
+ left: scale.x(mark.x) - shift - rect.width,
144
+ top: scale.y(mark.y) - shift - rect.height
145
+ };
114
146
 
115
147
  case 'top-right':
116
- {
117
- return {
118
- left: "".concat((scale.x(mark.x) + shift) / font, "rem"),
119
- top: "".concat((scale.y(mark.y) - shift - rect.height) / font, "rem")
120
- };
121
- }
148
+ return {
149
+ left: scale.x(mark.x) + shift,
150
+ top: scale.y(mark.y) - shift - rect.height
151
+ };
152
+
153
+ default:
154
+ return {};
122
155
  }
123
156
  };
124
157
 
125
158
  exports.coordinates = coordinates;
126
159
 
160
+ var LabelInput = function LabelInput(_ref2) {
161
+ var _ref = _ref2._ref,
162
+ externalInputRef = _ref2.externalInputRef,
163
+ label = _ref2.label,
164
+ disabled = _ref2.disabled,
165
+ inputClassName = _ref2.inputClassName,
166
+ onChange = _ref2.onChange;
167
+ return /*#__PURE__*/_react["default"].createElement(_reactInputAutosize["default"], {
168
+ inputRef: function inputRef(r) {
169
+ _ref(r);
170
+
171
+ externalInputRef(r);
172
+ },
173
+ disabled: disabled,
174
+ inputClassName: inputClassName,
175
+ value: label,
176
+ onChange: onChange
177
+ });
178
+ };
179
+
127
180
  var MarkLabel = function MarkLabel(props) {
128
181
  var _cn;
129
182
 
@@ -148,6 +201,10 @@ var MarkLabel = function MarkLabel(props) {
148
201
  label = _useState4[0],
149
202
  setLabel = _useState4[1];
150
203
 
204
+ var correctness = mark.correctness,
205
+ correctnesslabel = mark.correctnesslabel,
206
+ correctlabel = mark.correctlabel;
207
+
151
208
  var onChange = function onChange(e) {
152
209
  return setLabel(e.target.value);
153
210
  };
@@ -163,32 +220,86 @@ var MarkLabel = function MarkLabel(props) {
163
220
  props.onChange(debouncedLabel);
164
221
  }
165
222
  }, [debouncedLabel]);
166
- var fontSize = theme && theme.typography ? theme.typography.fontSize + 2 : 16;
167
223
  var rect = input ? input.getBoundingClientRect() : {
168
224
  width: 0,
169
225
  height: 0
170
226
  };
171
227
  var pos = position(graphProps, mark, rect);
172
- var leftTop = coordinates(graphProps, mark, rect, pos, fontSize);
228
+ var leftTop = coordinates(graphProps, mark, rect, pos);
173
229
 
174
230
  var style = _objectSpread({
175
231
  position: 'fixed',
176
- pointerEvents: 'auto'
232
+ pointerEvents: 'auto',
233
+ display: 'flex',
234
+ alignItems: 'center',
235
+ gap: '3px'
177
236
  }, leftTop);
178
237
 
238
+ var secondLabelStyle = _objectSpread(_objectSpread({}, style), {}, {
239
+ top: leftTop.top + 25
240
+ });
241
+
179
242
  var disabledInput = disabled || mark.disabled;
180
- return /*#__PURE__*/_react["default"].createElement(_reactInputAutosize["default"], {
181
- inputRef: function inputRef(r) {
182
- _ref(r);
183
243
 
184
- externalInputRef(r);
185
- },
186
- disabled: disabledInput,
187
- inputClassName: (0, _classnames["default"])(classes.input, (_cn = {}, (0, _defineProperty2["default"])(_cn, classes.disabled, disabled), (0, _defineProperty2["default"])(_cn, classes.disabledMark, mark.disabled), _cn)),
188
- value: label,
189
- style: style,
190
- onChange: onChange
191
- });
244
+ var renderInput = function renderInput(inputClass, labelValue) {
245
+ return /*#__PURE__*/_react["default"].createElement(LabelInput, {
246
+ _ref: _ref,
247
+ externalInputRef: externalInputRef,
248
+ label: labelValue,
249
+ disabled: disabledInput,
250
+ inputClassName: (0, _classnames["default"])(inputClass),
251
+ onChange: onChange
252
+ });
253
+ };
254
+
255
+ if (correctness === 'correct' && correctnesslabel === 'correct' && correctlabel) {
256
+ return /*#__PURE__*/_react["default"].createElement("div", {
257
+ className: classes.inputCorrect,
258
+ style: style
259
+ }, /*#__PURE__*/_react["default"].createElement(_labelSvgIcon["default"], {
260
+ type: "correct"
261
+ }), renderInput(classes.inputStudent, correctlabel));
262
+ } // avoid rendering empty label when a correct point without label was provided
263
+
264
+
265
+ if (correctness === 'correct' && correctnesslabel === 'correct' && !correctlabel) {
266
+ return null;
267
+ }
268
+
269
+ if (correctness === 'correct' && correctnesslabel === 'incorrect') {
270
+ return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
271
+ className: classes.inputIncorrect,
272
+ style: style
273
+ }, /*#__PURE__*/_react["default"].createElement(_labelSvgIcon["default"], {
274
+ type: "incorrect"
275
+ }), label === '' ? /*#__PURE__*/_react["default"].createElement(_labelSvgIcon["default"], {
276
+ type: "empty",
277
+ style: {
278
+ marginLeft: '3px'
279
+ }
280
+ }) : renderInput(classes.inputStudent, label)), /*#__PURE__*/_react["default"].createElement("div", {
281
+ className: classes.inputMissing,
282
+ style: secondLabelStyle
283
+ }, renderInput(classes.inputStudent, correctlabel)));
284
+ }
285
+
286
+ if (correctness === 'missing') {
287
+ return /*#__PURE__*/_react["default"].createElement("div", {
288
+ className: classes.inputMissing,
289
+ style: style
290
+ }, renderInput(classes.inputStudent, label));
291
+ }
292
+
293
+ if (correctness === 'incorrect') {
294
+ return /*#__PURE__*/_react["default"].createElement("div", {
295
+ className: classes.incorrect,
296
+ style: style
297
+ }, renderInput(classes.inputStudent, label));
298
+ }
299
+
300
+ return /*#__PURE__*/_react["default"].createElement("div", {
301
+ style: style
302
+ }, renderInput((0, _classnames["default"])(classes.input, (_cn = {}, (0, _defineProperty2["default"])(_cn, classes.disabled, disabled), (0, _defineProperty2["default"])(_cn, classes.disabledMark, mark.disabled), _cn)), label));
192
303
  };
193
304
 
194
305
  exports.MarkLabel = MarkLabel;
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/mark-label.jsx"],"names":["styles","theme","input","padding","spacing","unit","fontFamily","typography","fontSize","border","color","secondary","borderRadius","primaryDark","disabled","background","palette","paper","disabledMark","position","graphProps","mark","rect","width","height","scale","domain","range","shift","rightEdge","x","bottomEdge","y","h","max","v","min","coordinates","font","left","top","MarkLabel","props","setInput","_ref","node","classes","externalInputRef","inputRef","label","setLabel","onChange","e","target","value","debouncedLabel","getBoundingClientRect","pos","leftTop","style","pointerEvents","disabledInput","r","propTypes","PropTypes","bool","func","types","GraphPropsType","object","withTheme"],"mappings":"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","sourcesContent":["import React, { useState, useCallback, useEffect } from 'react';\nimport cn from 'classnames';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport AutosizeInput from 'react-input-autosize';\nimport { useDebounce } from './use-debounce';\nimport { types } from '@pie-lib/plot';\nimport { color } from '@pie-lib/render-ui';\n\nconst styles = (theme) => ({\n input: {\n float: 'right',\n padding: theme.spacing.unit * 0.5,\n fontFamily: theme.typography.fontFamily,\n fontSize: theme.typography.fontSize,\n border: `solid 1px ${color.secondary()}`,\n borderRadius: '3px',\n color: color.primaryDark(),\n },\n disabled: {\n border: `solid 1px ${color.primaryDark()}`,\n background: theme.palette.background.paper,\n },\n disabledMark: {\n border: `solid 1px ${color.disabled()}`,\n background: theme.palette.background.paper,\n color: color.disabled(),\n },\n});\n\nexport const position = (graphProps, mark, rect) => {\n rect = rect || { width: 0, height: 0 };\n const { scale, domain, range } = graphProps;\n const shift = 10;\n\n const rightEdge = scale.x(mark.x) + rect.width + shift;\n const bottomEdge = scale.y(mark.y) + rect.height + shift;\n\n const h = rightEdge >= scale.x(domain.max) ? 'left' : 'right';\n const v = bottomEdge >= scale.y(range.min) ? 'top' : 'bottom';\n\n return `${v}-${h}`;\n};\n\nexport const coordinates = (graphProps, mark, rect, position, fontSize) => {\n const { scale } = graphProps;\n const shift = 10;\n const font = fontSize ? fontSize : 16;\n rect = rect || { width: 0, height: 0 };\n\n switch (position) {\n case 'bottom-right': {\n return { left: `${(scale.x(mark.x) + shift) / font}rem`, top: `${(scale.y(mark.y) + shift) / font}rem` };\n }\n\n case 'bottom-left': {\n return {\n left: `${(scale.x(mark.x) - shift - rect.width) / font}rem`,\n top: `${(scale.y(mark.y) + shift) / font}rem`,\n };\n }\n\n case 'top-left': {\n return {\n left: `${(scale.x(mark.x) - shift - rect.width) / font}rem`,\n top: `${(scale.y(mark.y) - shift - rect.height) / font}rem`,\n };\n }\n\n case 'top-right': {\n return {\n left: `${(scale.x(mark.x) + shift) / font}rem`,\n top: `${(scale.y(mark.y) - shift - rect.height) / font}rem`,\n };\n }\n }\n};\n\nexport const MarkLabel = (props) => {\n const [input, setInput] = useState(null);\n const _ref = useCallback((node) => setInput(node));\n\n const { mark, graphProps, classes, disabled, inputRef: externalInputRef, theme } = props;\n\n const [label, setLabel] = useState(mark.label);\n\n const onChange = (e) => setLabel(e.target.value);\n\n const debouncedLabel = useDebounce(label, 200);\n\n // useState only sets the value once, to synch props to state need useEffect\n useEffect(() => {\n setLabel(mark.label);\n }, [mark.label]);\n\n // pick up the change to debouncedLabel and save it\n useEffect(() => {\n if (typeof debouncedLabel === 'string' && debouncedLabel !== mark.label) {\n props.onChange(debouncedLabel);\n }\n }, [debouncedLabel]);\n\n const fontSize = theme && theme.typography ? theme.typography.fontSize + 2 : 16;\n const rect = input ? input.getBoundingClientRect() : { width: 0, height: 0 };\n const pos = position(graphProps, mark, rect);\n const leftTop = coordinates(graphProps, mark, rect, pos, fontSize);\n\n const style = {\n position: 'fixed',\n pointerEvents: 'auto',\n ...leftTop,\n };\n\n const disabledInput = disabled || mark.disabled;\n\n return (\n <AutosizeInput\n inputRef={(r) => {\n _ref(r);\n externalInputRef(r);\n }}\n disabled={disabledInput}\n inputClassName={cn(classes.input, {\n [classes.disabled]: disabled,\n [classes.disabledMark]: mark.disabled,\n })}\n value={label}\n style={style}\n onChange={onChange}\n />\n );\n};\n\nMarkLabel.propTypes = {\n disabled: PropTypes.bool,\n onChange: PropTypes.func,\n graphProps: types.GraphPropsType,\n classes: PropTypes.object,\n inputRef: PropTypes.func,\n mark: PropTypes.object,\n theme: PropTypes.object,\n};\n\nexport default withStyles(styles, { withTheme: true })(MarkLabel);\n"],"file":"mark-label.js"}
1
+ {"version":3,"sources":["../src/mark-label.jsx"],"names":["inputStyles","theme","padding","spacing","unit","borderRadius","fontSize","backgroundColor","color","defaults","WHITE","styles","inputStudent","border","fontWeight","input","fontFamily","typography","SECONDARY","PRIMARY_DARK","disabled","disabledMark","inputCorrect","CORRECT_WITH_ICON","inputIncorrect","INCORRECT_WITH_ICON","inputMissing","MISSING_WITH_ICON","incorrect","position","graphProps","mark","rect","width","height","scale","domain","range","shift","rightEdge","x","bottomEdge","y","h","max","v","min","coordinates","left","top","LabelInput","_ref","externalInputRef","label","inputClassName","onChange","r","MarkLabel","props","setInput","node","classes","inputRef","setLabel","correctness","correctnesslabel","correctlabel","e","target","value","debouncedLabel","getBoundingClientRect","pos","leftTop","style","pointerEvents","display","alignItems","gap","secondLabelStyle","disabledInput","renderInput","inputClass","labelValue","marginLeft","propTypes","PropTypes","bool","func","types","GraphPropsType","object","withTheme"],"mappings":"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","sourcesContent":["import React, { useState, useCallback, useEffect } from 'react';\nimport cn from 'classnames';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport AutosizeInput from 'react-input-autosize';\nimport { useDebounce } from './use-debounce';\nimport { types } from '@pie-lib/plot';\nimport { color } from '@pie-lib/render-ui';\nimport SvgIcon from './label-svg-icon';\n\nconst inputStyles = (theme) => ({\n float: 'right',\n padding: theme.spacing.unit * 0.5,\n borderRadius: '4px',\n fontSize: '10px',\n backgroundColor: color.defaults.WHITE,\n});\n\nconst styles = (theme) => ({\n inputStudent: {\n ...inputStyles(theme),\n padding: '0',\n border: 'none',\n color: 'inherit',\n fontWeight: 'bold',\n },\n input: {\n float: 'right',\n padding: theme.spacing.unit * 0.5,\n fontFamily: theme.typography.fontFamily,\n fontSize: '10px',\n border: `solid 1px ${color.defaults.SECONDARY}`,\n borderRadius: '3px',\n color: color.defaults.PRIMARY_DARK,\n backgroundColor: color.defaults.WHITE,\n },\n disabled: {\n border: `solid 1px ${color.defaults.PRIMARY_DARK}`,\n backgroundColor: color.defaults.WHITE,\n '-webkit-opacity': '1',\n },\n disabledMark: {\n border: `solid 1px ${color.disabled()}`,\n color: color.disabled(),\n '-webkit-text-fill-color': color.disabled(),\n },\n inputCorrect: {\n ...inputStyles(theme),\n color: color.defaults.CORRECT_WITH_ICON,\n border: `solid 1px ${color.defaults.CORRECT_WITH_ICON}`,\n },\n inputIncorrect: {\n ...inputStyles(theme),\n color: color.defaults.INCORRECT_WITH_ICON,\n border: `solid 1px ${color.defaults.INCORRECT_WITH_ICON}`,\n },\n inputMissing: {\n ...inputStyles(theme),\n color: color.defaults.MISSING_WITH_ICON,\n border: `solid 1px ${color.defaults.MISSING_WITH_ICON}`,\n fontWeight: 'bold',\n },\n incorrect: {\n ...inputStyles(theme),\n color: color.defaults.INCORRECT_WITH_ICON,\n fontWeight: 'bold',\n padding: '0',\n },\n});\n\nexport const position = (graphProps, mark, rect = { width: 0, height: 0 }) => {\n const { scale, domain, range } = graphProps;\n const shift = 5;\n\n const rightEdge = scale.x(mark.x) + rect.width + shift;\n const bottomEdge = scale.y(mark.y) + rect.height + shift;\n\n const h = rightEdge >= scale.x(domain.max) ? 'left' : 'right';\n const v = bottomEdge >= scale.y(range.min) ? 'top' : 'bottom';\n\n return `${v}-${h}`;\n};\n\nexport const coordinates = (graphProps, mark, rect = { width: 0, height: 0 }, position) => {\n const { scale } = graphProps;\n const shift = 5;\n\n switch (position) {\n case 'bottom-right':\n return { left: scale.x(mark.x) + shift, top: scale.y(mark.y) + shift };\n case 'bottom-left':\n return { left: scale.x(mark.x) - shift - rect.width, top: scale.y(mark.y) + shift };\n case 'top-left':\n return { left: scale.x(mark.x) - shift - rect.width, top: scale.y(mark.y) - shift - rect.height };\n case 'top-right':\n return { left: scale.x(mark.x) + shift, top: scale.y(mark.y) - shift - rect.height };\n default:\n return {};\n }\n};\n\nconst LabelInput = ({ _ref, externalInputRef, label, disabled, inputClassName, onChange }) => (\n <AutosizeInput\n inputRef={(r) => {\n _ref(r);\n externalInputRef(r);\n }}\n disabled={disabled}\n inputClassName={inputClassName}\n value={label}\n onChange={onChange}\n />\n);\n\nexport const MarkLabel = (props) => {\n const [input, setInput] = useState(null);\n const _ref = useCallback((node) => setInput(node));\n\n const { mark, graphProps, classes, disabled, inputRef: externalInputRef, theme } = props;\n\n const [label, setLabel] = useState(mark.label);\n const { correctness, correctnesslabel, correctlabel } = mark;\n const onChange = (e) => setLabel(e.target.value);\n\n const debouncedLabel = useDebounce(label, 200);\n\n // useState only sets the value once, to synch props to state need useEffect\n useEffect(() => {\n setLabel(mark.label);\n }, [mark.label]);\n\n // pick up the change to debouncedLabel and save it\n useEffect(() => {\n if (typeof debouncedLabel === 'string' && debouncedLabel !== mark.label) {\n props.onChange(debouncedLabel);\n }\n }, [debouncedLabel]);\n\n const rect = input ? input.getBoundingClientRect() : { width: 0, height: 0 };\n const pos = position(graphProps, mark, rect);\n const leftTop = coordinates(graphProps, mark, rect, pos);\n\n const style = {\n position: 'fixed',\n pointerEvents: 'auto',\n display: 'flex',\n alignItems: 'center',\n gap: '3px',\n ...leftTop,\n };\n\n const secondLabelStyle = {\n ...style,\n top: leftTop.top + 25,\n };\n\n const disabledInput = disabled || mark.disabled;\n\n const renderInput = (inputClass, labelValue) => (\n <LabelInput\n _ref={_ref}\n externalInputRef={externalInputRef}\n label={labelValue}\n disabled={disabledInput}\n inputClassName={cn(inputClass)}\n onChange={onChange}\n />\n );\n\n if (correctness === 'correct' && correctnesslabel === 'correct' && correctlabel) {\n return (\n <div className={classes.inputCorrect} style={style}>\n <SvgIcon type=\"correct\" />\n {renderInput(classes.inputStudent, correctlabel)}\n </div>\n );\n }\n\n // avoid rendering empty label when a correct point without label was provided\n if (correctness === 'correct' && correctnesslabel === 'correct' && !correctlabel) {\n return null;\n }\n\n if (correctness === 'correct' && correctnesslabel === 'incorrect') {\n return (\n <>\n <div className={classes.inputIncorrect} style={style}>\n <SvgIcon type=\"incorrect\" />\n {label === '' ? (\n <SvgIcon type=\"empty\" style={{ marginLeft: '3px' }} />\n ) : (\n renderInput(classes.inputStudent, label)\n )}\n </div>\n <div className={classes.inputMissing} style={secondLabelStyle}>\n {renderInput(classes.inputStudent, correctlabel)}\n </div>\n </>\n );\n }\n\n if (correctness === 'missing') {\n return (\n <div className={classes.inputMissing} style={style}>\n {renderInput(classes.inputStudent, label)}\n </div>\n );\n }\n\n if (correctness === 'incorrect') {\n return (\n <div className={classes.incorrect} style={style}>\n {renderInput(classes.inputStudent, label)}\n </div>\n );\n }\n\n return (\n <div style={style}>\n {renderInput(\n cn(classes.input, {\n [classes.disabled]: disabled,\n [classes.disabledMark]: mark.disabled,\n }),\n label,\n )}\n </div>\n );\n};\n\nMarkLabel.propTypes = {\n disabled: PropTypes.bool,\n onChange: PropTypes.func,\n graphProps: types.GraphPropsType,\n classes: PropTypes.object,\n inputRef: PropTypes.func,\n mark: PropTypes.object,\n theme: PropTypes.object,\n};\n\nexport default withStyles(styles, { withTheme: true })(MarkLabel);\n"],"file":"mark-label.js"}
package/lib/toggle-bar.js CHANGED
@@ -33,7 +33,7 @@ var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
33
33
 
34
34
  var _renderUi = require("@pie-lib/render-ui");
35
35
 
36
- var _index = require("./tools/index");
36
+ var _tools = require("./tools");
37
37
 
38
38
  var _drag = require("@pie-lib/drag");
39
39
 
@@ -158,7 +158,7 @@ var ToggleBar = /*#__PURE__*/function (_React$Component) {
158
158
  return /*#__PURE__*/_react["default"].createElement("div", {
159
159
  className: (0, _classnames["default"])(className, classes.toolsContainer)
160
160
  }, (options || []).map(function (option, index) {
161
- if ((_index.allTools || []).includes(option)) {
161
+ if ((_tools.allTools || []).includes(option)) {
162
162
  var isSelected = option === selectedToolType;
163
163
 
164
164
  var toolRef = /*#__PURE__*/_react["default"].createRef();
@@ -209,8 +209,7 @@ var styles = function styles(theme) {
209
209
  button: {
210
210
  marginRight: theme.spacing.unit / 2,
211
211
  marginBottom: theme.spacing.unit / 2,
212
- color: _renderUi.color.text(),
213
- backgroundColor: _renderUi.color.background()
212
+ color: _renderUi.color.text()
214
213
  },
215
214
  under: {
216
215
  position: 'absolute',
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/toggle-bar.jsx"],"names":["translator","Translator","buttonStyles","root","color","text","selected","backgroundColor","background","border","secondary","notSelected","primary","disabled","MiniButton","props","classes","className","value","onClick","language","translatorKey","toLowerCase","e","buttonValue","t","lng","propTypes","PropTypes","bool","object","string","disabledClassName","func","ToggleBar","onChange","target","textContent","dragIndex","hoverIndex","options","onChangeToolsOrder","dragged","splice","selectedToolType","draggableTools","toolsContainer","map","option","index","allTools","includes","isSelected","toolRef","React","createRef","moveTool","button","select","Component","isRequired","arrayOf","styles","theme","display","flexWrap","marginRight","spacing","unit","marginBottom","under","position","top","left","zIndex","pointerEvents","wrapper","hidden","opacity","DRAG_TYPE","Item","children","connectDragSource","connectDropTarget","connectDragPreview","isDragging","oneOfType","node","any","itemSource","canDrag","draggable","beginDrag","itemTarget","hover","monitor","getItem","current","hoverBoundingRect","getBoundingClientRect","hoverMiddleX","right","clientOffset","getClientOffset","hoverClientX","x","collectTarget","connect","dropTarget","collectSource","dragSource","dragPreview","DragTool"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport cn from 'classnames';\nimport Button from '@material-ui/core/Button';\nimport { color } from '@pie-lib/render-ui';\nimport { allTools } from './tools/index';\nimport { withDragContext, DragSource, DropTarget } from '@pie-lib/drag';\nimport Translator from '@pie-lib/translator';\n\nconst { translator } = Translator;\n\nconst buttonStyles = () => ({\n root: {\n color: color.text(),\n },\n selected: {\n backgroundColor: color.background(),\n border: `1px solid ${color.secondary()}`,\n },\n notSelected: {\n '& span': {\n color: color.primary(),\n },\n backgroundColor: color.background(),\n },\n disabled: {\n '& span': {\n color: color.primary(),\n },\n backgroundColor: color.disabled(),\n },\n});\n\nexport const MiniButton = withStyles(buttonStyles)((props) => {\n const { disabled, classes, className, selected, value, onClick, language } = props;\n const translatorKey = value.toLowerCase();\n\n return (\n <Button\n size=\"small\"\n disabled={disabled}\n className={cn(classes.root, selected && classes.selected, className)}\n classes={{ disabled: cn(disabled && classes.disabled) }}\n value={value}\n key={value}\n variant=\"outlined\"\n onClick={(e) => onClick({ ...e, buttonValue: value })}\n >\n {translator.t(`graphing.${translatorKey}`, { lng: language })}\n </Button>\n );\n});\n\nMiniButton.propTypes = {\n disabled: PropTypes.bool,\n classes: PropTypes.object,\n className: PropTypes.string,\n disabledClassName: PropTypes.string,\n selected: PropTypes.bool,\n value: PropTypes.string,\n onClick: PropTypes.func,\n};\n\nexport class ToggleBar extends React.Component {\n static propTypes = {\n classes: PropTypes.object.isRequired,\n className: PropTypes.string,\n options: PropTypes.arrayOf(PropTypes.string),\n selectedToolType: PropTypes.string,\n disabled: PropTypes.bool,\n draggableTools: PropTypes.bool,\n onChange: PropTypes.func,\n onChangeToolsOrder: PropTypes.func,\n language: PropTypes.string,\n };\n\n static defaultProps = {};\n\n select = (e) => this.props.onChange(e.buttonValue || e.target.textContent);\n\n moveTool = (dragIndex, hoverIndex) => {\n const { options, onChangeToolsOrder } = this.props;\n const dragged = options[dragIndex];\n\n options.splice(dragIndex, 1);\n options.splice(hoverIndex, 0, dragged);\n\n onChangeToolsOrder(options);\n };\n\n render() {\n const { classes, className, disabled, options, selectedToolType, draggableTools, language } = this.props;\n\n return (\n <div className={cn(className, classes.toolsContainer)}>\n {(options || []).map((option, index) => {\n if ((allTools || []).includes(option)) {\n const isSelected = option === selectedToolType;\n const toolRef = React.createRef();\n\n return (\n <DragTool\n key={option}\n index={index}\n draggable={draggableTools}\n moveTool={this.moveTool}\n classes={classes}\n toolRef={toolRef}\n >\n <MiniButton\n className={cn(classes.button, isSelected && classes.selected)}\n disabled={disabled}\n disableRipple={true}\n onClick={this.select}\n value={option}\n selected={isSelected}\n language={language}\n />\n </DragTool>\n );\n }\n })}\n </div>\n );\n }\n}\n\nconst styles = (theme) => ({\n toolsContainer: {\n display: 'flex',\n flexWrap: 'wrap',\n },\n button: {\n marginRight: theme.spacing.unit / 2,\n marginBottom: theme.spacing.unit / 2,\n color: color.text(),\n backgroundColor: color.background(),\n },\n under: {\n position: 'absolute',\n top: 0,\n left: 0,\n zIndex: -1,\n pointerEvents: 'none',\n },\n wrapper: {\n position: 'relative',\n },\n hidden: {\n opacity: 0,\n },\n});\n\nexport default withDragContext(withStyles(styles)(ToggleBar));\n\nconst DRAG_TYPE = 'tool';\n\nexport class Item extends React.Component {\n static propTypes = {\n classes: PropTypes.object.isRequired,\n className: PropTypes.string,\n children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),\n connectDragSource: PropTypes.func.isRequired,\n connectDragPreview: PropTypes.func.isRequired,\n connectDropTarget: PropTypes.func.isRequired,\n isDragging: PropTypes.bool,\n toolRef: PropTypes.any,\n };\n\n static defaultProps = {};\n\n render() {\n const {\n classes,\n children,\n connectDragSource,\n connectDropTarget,\n connectDragPreview,\n isDragging,\n toolRef,\n } = this.props;\n\n return (\n <div className={classes.wrapper} ref={toolRef}>\n {connectDragSource(connectDropTarget(<div className={isDragging && classes.hidden}>{children}</div>))}\n {connectDragPreview(<div className={classes.under}>{children}</div>)}\n </div>\n );\n }\n}\n\nconst itemSource = {\n canDrag(props) {\n return props.draggable;\n },\n beginDrag(props) {\n return {\n index: props.index,\n };\n },\n};\n\nconst itemTarget = {\n hover(props, monitor) {\n const dragIndex = monitor.getItem().index;\n const { toolRef, index: hoverIndex } = props;\n\n if (dragIndex === hoverIndex || !toolRef.current) {\n return;\n }\n\n const hoverBoundingRect = toolRef.current?.getBoundingClientRect();\n const hoverMiddleX = (hoverBoundingRect.right - hoverBoundingRect.left) / 2;\n const clientOffset = monitor.getClientOffset();\n const hoverClientX = clientOffset.x - hoverBoundingRect.left;\n\n if (dragIndex < hoverIndex && hoverClientX < hoverMiddleX) {\n return;\n }\n\n if (dragIndex > hoverIndex && hoverClientX > hoverMiddleX) {\n return;\n }\n\n props.moveTool(dragIndex, hoverIndex);\n monitor.getItem().index = hoverIndex;\n },\n};\n\nconst collectTarget = (connect) => ({ connectDropTarget: connect.dropTarget() });\n\nconst collectSource = (connect, monitor) => ({\n connectDragSource: connect.dragSource(),\n connectDragPreview: connect.dragPreview(),\n isDragging: monitor.isDragging(),\n});\n\nconst DragTool = DropTarget(\n DRAG_TYPE,\n itemTarget,\n collectTarget,\n)(DragSource(DRAG_TYPE, itemSource, collectSource)(Item));\n"],"file":"toggle-bar.js"}
1
+ {"version":3,"sources":["../src/toggle-bar.jsx"],"names":["translator","Translator","buttonStyles","root","color","text","selected","backgroundColor","background","border","secondary","notSelected","primary","disabled","MiniButton","props","classes","className","value","onClick","language","translatorKey","toLowerCase","e","buttonValue","t","lng","propTypes","PropTypes","bool","object","string","disabledClassName","func","ToggleBar","onChange","target","textContent","dragIndex","hoverIndex","options","onChangeToolsOrder","dragged","splice","selectedToolType","draggableTools","toolsContainer","map","option","index","allTools","includes","isSelected","toolRef","React","createRef","moveTool","button","select","Component","isRequired","arrayOf","styles","theme","display","flexWrap","marginRight","spacing","unit","marginBottom","under","position","top","left","zIndex","pointerEvents","wrapper","hidden","opacity","DRAG_TYPE","Item","children","connectDragSource","connectDropTarget","connectDragPreview","isDragging","oneOfType","node","any","itemSource","canDrag","draggable","beginDrag","itemTarget","hover","monitor","getItem","current","hoverBoundingRect","getBoundingClientRect","hoverMiddleX","right","clientOffset","getClientOffset","hoverClientX","x","collectTarget","connect","dropTarget","collectSource","dragSource","dragPreview","DragTool"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport cn from 'classnames';\nimport Button from '@material-ui/core/Button';\nimport { color } from '@pie-lib/render-ui';\nimport { allTools } from './tools';\nimport { withDragContext, DragSource, DropTarget } from '@pie-lib/drag';\nimport Translator from '@pie-lib/translator';\n\nconst { translator } = Translator;\n\nconst buttonStyles = () => ({\n root: {\n color: color.text(),\n },\n selected: {\n backgroundColor: color.background(),\n border: `1px solid ${color.secondary()}`,\n },\n notSelected: {\n '& span': {\n color: color.primary(),\n },\n backgroundColor: color.background(),\n },\n disabled: {\n '& span': {\n color: color.primary(),\n },\n backgroundColor: color.disabled(),\n },\n});\n\nexport const MiniButton = withStyles(buttonStyles)((props) => {\n const { disabled, classes, className, selected, value, onClick, language } = props;\n const translatorKey = value.toLowerCase();\n\n return (\n <Button\n size=\"small\"\n disabled={disabled}\n className={cn(classes.root, selected && classes.selected, className)}\n classes={{ disabled: cn(disabled && classes.disabled) }}\n value={value}\n key={value}\n variant=\"outlined\"\n onClick={(e) => onClick({ ...e, buttonValue: value })}\n >\n {translator.t(`graphing.${translatorKey}`, { lng: language })}\n </Button>\n );\n});\n\nMiniButton.propTypes = {\n disabled: PropTypes.bool,\n classes: PropTypes.object,\n className: PropTypes.string,\n disabledClassName: PropTypes.string,\n selected: PropTypes.bool,\n value: PropTypes.string,\n onClick: PropTypes.func,\n};\n\nexport class ToggleBar extends React.Component {\n static propTypes = {\n classes: PropTypes.object.isRequired,\n className: PropTypes.string,\n options: PropTypes.arrayOf(PropTypes.string),\n selectedToolType: PropTypes.string,\n disabled: PropTypes.bool,\n draggableTools: PropTypes.bool,\n onChange: PropTypes.func,\n onChangeToolsOrder: PropTypes.func,\n language: PropTypes.string,\n };\n\n static defaultProps = {};\n\n select = (e) => this.props.onChange(e.buttonValue || e.target.textContent);\n\n moveTool = (dragIndex, hoverIndex) => {\n const { options, onChangeToolsOrder } = this.props;\n const dragged = options[dragIndex];\n\n options.splice(dragIndex, 1);\n options.splice(hoverIndex, 0, dragged);\n\n onChangeToolsOrder(options);\n };\n\n render() {\n const { classes, className, disabled, options, selectedToolType, draggableTools, language } = this.props;\n\n return (\n <div className={cn(className, classes.toolsContainer)}>\n {(options || []).map((option, index) => {\n if ((allTools || []).includes(option)) {\n const isSelected = option === selectedToolType;\n const toolRef = React.createRef();\n\n return (\n <DragTool\n key={option}\n index={index}\n draggable={draggableTools}\n moveTool={this.moveTool}\n classes={classes}\n toolRef={toolRef}\n >\n <MiniButton\n className={cn(classes.button, isSelected && classes.selected)}\n disabled={disabled}\n disableRipple={true}\n onClick={this.select}\n value={option}\n selected={isSelected}\n language={language}\n />\n </DragTool>\n );\n }\n })}\n </div>\n );\n }\n}\n\nconst styles = (theme) => ({\n toolsContainer: {\n display: 'flex',\n flexWrap: 'wrap',\n },\n button: {\n marginRight: theme.spacing.unit / 2,\n marginBottom: theme.spacing.unit / 2,\n color: color.text(),\n },\n under: {\n position: 'absolute',\n top: 0,\n left: 0,\n zIndex: -1,\n pointerEvents: 'none',\n },\n wrapper: {\n position: 'relative',\n },\n hidden: {\n opacity: 0,\n },\n});\n\nexport default withDragContext(withStyles(styles)(ToggleBar));\n\nconst DRAG_TYPE = 'tool';\n\nexport class Item extends React.Component {\n static propTypes = {\n classes: PropTypes.object.isRequired,\n className: PropTypes.string,\n children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),\n connectDragSource: PropTypes.func.isRequired,\n connectDragPreview: PropTypes.func.isRequired,\n connectDropTarget: PropTypes.func.isRequired,\n isDragging: PropTypes.bool,\n toolRef: PropTypes.any,\n };\n\n static defaultProps = {};\n\n render() {\n const {\n classes,\n children,\n connectDragSource,\n connectDropTarget,\n connectDragPreview,\n isDragging,\n toolRef,\n } = this.props;\n\n return (\n <div className={classes.wrapper} ref={toolRef}>\n {connectDragSource(connectDropTarget(<div className={isDragging && classes.hidden}>{children}</div>))}\n {connectDragPreview(<div className={classes.under}>{children}</div>)}\n </div>\n );\n }\n}\n\nconst itemSource = {\n canDrag(props) {\n return props.draggable;\n },\n beginDrag(props) {\n return {\n index: props.index,\n };\n },\n};\n\nconst itemTarget = {\n hover(props, monitor) {\n const dragIndex = monitor.getItem().index;\n const { toolRef, index: hoverIndex } = props;\n\n if (dragIndex === hoverIndex || !toolRef.current) {\n return;\n }\n\n const hoverBoundingRect = toolRef.current?.getBoundingClientRect();\n const hoverMiddleX = (hoverBoundingRect.right - hoverBoundingRect.left) / 2;\n const clientOffset = monitor.getClientOffset();\n const hoverClientX = clientOffset.x - hoverBoundingRect.left;\n\n if (dragIndex < hoverIndex && hoverClientX < hoverMiddleX) {\n return;\n }\n\n if (dragIndex > hoverIndex && hoverClientX > hoverMiddleX) {\n return;\n }\n\n props.moveTool(dragIndex, hoverIndex);\n monitor.getItem().index = hoverIndex;\n },\n};\n\nconst collectTarget = (connect) => ({ connectDropTarget: connect.dropTarget() });\n\nconst collectSource = (connect, monitor) => ({\n connectDragSource: connect.dragSource(),\n connectDragPreview: connect.dragPreview(),\n isDragging: monitor.isDragging(),\n});\n\nconst DragTool = DropTarget(\n DRAG_TYPE,\n itemTarget,\n collectTarget,\n)(DragSource(DRAG_TYPE, itemSource, collectSource)(Item));\n"],"file":"toggle-bar.js"}
package/lib/tool-menu.js CHANGED
@@ -54,13 +54,8 @@ var ToolMenu = /*#__PURE__*/function (_React$Component) {
54
54
  }
55
55
 
56
56
  _this = _super.call.apply(_super, [this].concat(args));
57
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "updateToolsOrder", function (tools, showLabel) {
57
+ (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "updateToolsOrder", function (tools) {
58
58
  var onChangeTools = _this.props.onChangeTools;
59
-
60
- if (showLabel) {
61
- tools.push('label');
62
- }
63
-
64
59
  onChangeTools(tools);
65
60
  });
66
61
  return _this;
@@ -76,17 +71,9 @@ var ToolMenu = /*#__PURE__*/function (_React$Component) {
76
71
  currentToolType = _this$props.currentToolType,
77
72
  disabled = _this$props.disabled,
78
73
  draggableTools = _this$props.draggableTools,
79
- labelModeEnabled = _this$props.labelModeEnabled,
80
- onToggleLabelMode = _this$props.onToggleLabelMode,
81
74
  onChange = _this$props.onChange,
82
75
  language = _this$props.language;
83
76
  var toolbarTools = this.props.toolbarTools;
84
- var showLabel = toolbarTools && toolbarTools.some(function (t) {
85
- return t === 'label';
86
- });
87
- toolbarTools = (toolbarTools || []).filter(function (tT) {
88
- return tT !== 'label';
89
- });
90
77
  return /*#__PURE__*/_react["default"].createElement("div", {
91
78
  className: (0, _classnames["default"])(className)
92
79
  }, /*#__PURE__*/_react["default"].createElement(_toggleBar["default"], {
@@ -96,15 +83,9 @@ var ToolMenu = /*#__PURE__*/function (_React$Component) {
96
83
  selectedToolType: currentToolType,
97
84
  onChange: onChange,
98
85
  onChangeToolsOrder: function onChangeToolsOrder(tools) {
99
- return _this2.updateToolsOrder(tools, showLabel);
86
+ return _this2.updateToolsOrder(tools);
100
87
  },
101
88
  language: language
102
- }), showLabel && /*#__PURE__*/_react["default"].createElement(_toggleBar.MiniButton, {
103
- disabled: disabled,
104
- value: 'Label',
105
- onClick: onToggleLabelMode,
106
- selected: labelModeEnabled,
107
- language: language
108
89
  }));
109
90
  }
110
91
  }]);
@@ -119,7 +100,6 @@ exports.ToolMenu = ToolMenu;
119
100
  draggableTools: _propTypes["default"].bool,
120
101
  labelModeEnabled: _propTypes["default"].bool,
121
102
  onChange: _propTypes["default"].func,
122
- onToggleLabelMode: _propTypes["default"].func,
123
103
  onChangeTools: _propTypes["default"].func,
124
104
  toolbarTools: _propTypes["default"].arrayOf(_propTypes["default"].string),
125
105
  language: _propTypes["default"].string
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/tool-menu.jsx"],"names":["ToolMenu","tools","showLabel","onChangeTools","props","push","className","currentToolType","disabled","draggableTools","labelModeEnabled","onToggleLabelMode","onChange","language","toolbarTools","some","t","filter","tT","updateToolsOrder","React","Component","PropTypes","string","bool","func","arrayOf"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;;;;;;;;;IAEaA,Q;;;;;;;;;;;;;;;yGAkBQ,UAACC,KAAD,EAAQC,SAAR,EAAsB;AACvC,UAAQC,aAAR,GAA0B,MAAKC,KAA/B,CAAQD,aAAR;;AAEA,UAAID,SAAJ,EAAe;AACbD,QAAAA,KAAK,CAACI,IAAN,CAAW,OAAX;AACD;;AAEDF,MAAAA,aAAa,CAACF,KAAD,CAAb;AACD,K;;;;;;WAED,kBAAS;AAAA;;AACP,wBASI,KAAKG,KATT;AAAA,UACEE,SADF,eACEA,SADF;AAAA,UAEEC,eAFF,eAEEA,eAFF;AAAA,UAGEC,QAHF,eAGEA,QAHF;AAAA,UAIEC,cAJF,eAIEA,cAJF;AAAA,UAKEC,gBALF,eAKEA,gBALF;AAAA,UAMEC,iBANF,eAMEA,iBANF;AAAA,UAOEC,QAPF,eAOEA,QAPF;AAAA,UAQEC,QARF,eAQEA,QARF;AAUA,UAAMC,YAAN,GAAuB,KAAKV,KAA5B,CAAMU,YAAN;AAEA,UAAMZ,SAAS,GAAGY,YAAY,IAAIA,YAAY,CAACC,IAAb,CAAkB,UAACC,CAAD;AAAA,eAAOA,CAAC,KAAK,OAAb;AAAA,OAAlB,CAAlC;AAEAF,MAAAA,YAAY,GAAG,CAACA,YAAY,IAAI,EAAjB,EAAqBG,MAArB,CAA4B,UAACC,EAAD;AAAA,eAAQA,EAAE,KAAK,OAAf;AAAA,OAA5B,CAAf;AAEA,0BACE;AAAK,QAAA,SAAS,EAAE,4BAAWZ,SAAX;AAAhB,sBACE,gCAAC,qBAAD;AACE,QAAA,QAAQ,EAAEE,QADZ;AAEE,QAAA,cAAc,EAAEC,cAFlB;AAGE,QAAA,OAAO,EAAEK,YAHX;AAIE,QAAA,gBAAgB,EAAEP,eAJpB;AAKE,QAAA,QAAQ,EAAEK,QALZ;AAME,QAAA,kBAAkB,EAAE,4BAACX,KAAD;AAAA,iBAAW,MAAI,CAACkB,gBAAL,CAAsBlB,KAAtB,EAA6BC,SAA7B,CAAX;AAAA,SANtB;AAOE,QAAA,QAAQ,EAAEW;AAPZ,QADF,EAWGX,SAAS,iBACR,gCAAC,qBAAD;AAAY,QAAA,QAAQ,EAAEM,QAAtB;AAAgC,QAAA,KAAK,EAAE,OAAvC;AAAgD,QAAA,OAAO,EAAEG,iBAAzD;AAA4E,QAAA,QAAQ,EAAED,gBAAtF;AAAwG,QAAA,QAAQ,EAAEG;AAAlH,QAZJ,CADF;AAiBD;;;EA9D2BO,kBAAMC,S;;;iCAAvBrB,Q,eACQ;AACjBM,EAAAA,SAAS,EAAEgB,sBAAUC,MADJ;AAEjBhB,EAAAA,eAAe,EAAEe,sBAAUC,MAFV;AAGjBf,EAAAA,QAAQ,EAAEc,sBAAUE,IAHH;AAIjBf,EAAAA,cAAc,EAAEa,sBAAUE,IAJT;AAKjBd,EAAAA,gBAAgB,EAAEY,sBAAUE,IALX;AAMjBZ,EAAAA,QAAQ,EAAEU,sBAAUG,IANH;AAOjBd,EAAAA,iBAAiB,EAAEW,sBAAUG,IAPZ;AAQjBtB,EAAAA,aAAa,EAAEmB,sBAAUG,IARR;AASjBX,EAAAA,YAAY,EAAEQ,sBAAUI,OAAV,CAAkBJ,sBAAUC,MAA5B,CATG;AAUjBV,EAAAA,QAAQ,EAAES,sBAAUC;AAVH,C;iCADRvB,Q,kBAcW;AACpBc,EAAAA,YAAY,EAAE;AADM,C;eAmDTd,Q","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nimport ToggleBar, { MiniButton } from './toggle-bar';\n\nexport class ToolMenu extends React.Component {\n static propTypes = {\n className: PropTypes.string,\n currentToolType: PropTypes.string,\n disabled: PropTypes.bool,\n draggableTools: PropTypes.bool,\n labelModeEnabled: PropTypes.bool,\n onChange: PropTypes.func,\n onToggleLabelMode: PropTypes.func,\n onChangeTools: PropTypes.func,\n toolbarTools: PropTypes.arrayOf(PropTypes.string),\n language: PropTypes.string,\n };\n\n static defaultProps = {\n toolbarTools: [],\n };\n\n updateToolsOrder = (tools, showLabel) => {\n const { onChangeTools } = this.props;\n\n if (showLabel) {\n tools.push('label');\n }\n\n onChangeTools(tools);\n };\n\n render() {\n const {\n className,\n currentToolType,\n disabled,\n draggableTools,\n labelModeEnabled,\n onToggleLabelMode,\n onChange,\n language\n } = this.props;\n let { toolbarTools } = this.props;\n\n const showLabel = toolbarTools && toolbarTools.some((t) => t === 'label');\n\n toolbarTools = (toolbarTools || []).filter((tT) => tT !== 'label');\n\n return (\n <div className={classNames(className)}>\n <ToggleBar\n disabled={disabled}\n draggableTools={draggableTools}\n options={toolbarTools}\n selectedToolType={currentToolType}\n onChange={onChange}\n onChangeToolsOrder={(tools) => this.updateToolsOrder(tools, showLabel)}\n language={language}\n />\n\n {showLabel && (\n <MiniButton disabled={disabled} value={'Label'} onClick={onToggleLabelMode} selected={labelModeEnabled} language={language} />\n )}\n </div>\n );\n }\n}\n\nexport default ToolMenu;\n"],"file":"tool-menu.js"}
1
+ {"version":3,"sources":["../src/tool-menu.jsx"],"names":["ToolMenu","tools","onChangeTools","props","className","currentToolType","disabled","draggableTools","onChange","language","toolbarTools","updateToolsOrder","React","Component","PropTypes","string","bool","labelModeEnabled","func","arrayOf"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AAEA;;;;;;;;;;IAEaA,Q;;;;;;;;;;;;;;;yGAiBQ,UAACC,KAAD,EAAW;AAC5B,UAAQC,aAAR,GAA0B,MAAKC,KAA/B,CAAQD,aAAR;AACAA,MAAAA,aAAa,CAACD,KAAD,CAAb;AACD,K;;;;;;WAED,kBAAS;AAAA;;AACP,wBAAqF,KAAKE,KAA1F;AAAA,UAAQC,SAAR,eAAQA,SAAR;AAAA,UAAmBC,eAAnB,eAAmBA,eAAnB;AAAA,UAAoCC,QAApC,eAAoCA,QAApC;AAAA,UAA8CC,cAA9C,eAA8CA,cAA9C;AAAA,UAA8DC,QAA9D,eAA8DA,QAA9D;AAAA,UAAwEC,QAAxE,eAAwEA,QAAxE;AACA,UAAMC,YAAN,GAAuB,KAAKP,KAA5B,CAAMO,YAAN;AAEA,0BACE;AAAK,QAAA,SAAS,EAAE,4BAAWN,SAAX;AAAhB,sBACE,gCAAC,qBAAD;AACE,QAAA,QAAQ,EAAEE,QADZ;AAEE,QAAA,cAAc,EAAEC,cAFlB;AAGE,QAAA,OAAO,EAAEG,YAHX;AAIE,QAAA,gBAAgB,EAAEL,eAJpB;AAKE,QAAA,QAAQ,EAAEG,QALZ;AAME,QAAA,kBAAkB,EAAE,4BAACP,KAAD;AAAA,iBAAW,MAAI,CAACU,gBAAL,CAAsBV,KAAtB,CAAX;AAAA,SANtB;AAOE,QAAA,QAAQ,EAAEQ;AAPZ,QADF,CADF;AAaD;;;EAvC2BG,kBAAMC,S;;;iCAAvBb,Q,eACQ;AACjBI,EAAAA,SAAS,EAAEU,sBAAUC,MADJ;AAEjBV,EAAAA,eAAe,EAAES,sBAAUC,MAFV;AAGjBT,EAAAA,QAAQ,EAAEQ,sBAAUE,IAHH;AAIjBT,EAAAA,cAAc,EAAEO,sBAAUE,IAJT;AAKjBC,EAAAA,gBAAgB,EAAEH,sBAAUE,IALX;AAMjBR,EAAAA,QAAQ,EAAEM,sBAAUI,IANH;AAOjBhB,EAAAA,aAAa,EAAEY,sBAAUI,IAPR;AAQjBR,EAAAA,YAAY,EAAEI,sBAAUK,OAAV,CAAkBL,sBAAUC,MAA5B,CARG;AASjBN,EAAAA,QAAQ,EAAEK,sBAAUC;AATH,C;iCADRf,Q,kBAaW;AACpBU,EAAAA,YAAY,EAAE;AADM,C;eA6BTV,Q","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nimport ToggleBar, { MiniButton } from './toggle-bar';\n\nexport class ToolMenu extends React.Component {\n static propTypes = {\n className: PropTypes.string,\n currentToolType: PropTypes.string,\n disabled: PropTypes.bool,\n draggableTools: PropTypes.bool,\n labelModeEnabled: PropTypes.bool,\n onChange: PropTypes.func,\n onChangeTools: PropTypes.func,\n toolbarTools: PropTypes.arrayOf(PropTypes.string),\n language: PropTypes.string,\n };\n\n static defaultProps = {\n toolbarTools: [],\n };\n\n updateToolsOrder = (tools) => {\n const { onChangeTools } = this.props;\n onChangeTools(tools);\n };\n\n render() {\n const { className, currentToolType, disabled, draggableTools, onChange, language } = this.props;\n let { toolbarTools } = this.props;\n\n return (\n <div className={classNames(className)}>\n <ToggleBar\n disabled={disabled}\n draggableTools={draggableTools}\n options={toolbarTools}\n selectedToolType={currentToolType}\n onChange={onChange}\n onChangeToolsOrder={(tools) => this.updateToolsOrder(tools)}\n language={language}\n />\n </div>\n );\n }\n}\n\nexport default ToolMenu;\n"],"file":"tool-menu.js"}
@@ -0,0 +1,35 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports["default"] = void 0;
9
+
10
+ var _debug = _interopRequireDefault(require("debug"));
11
+
12
+ var _graphingUtils = require("@pie-lib/graphing-utils");
13
+
14
+ var _withRootEdge = require("../shared/line/with-root-edge");
15
+
16
+ var log = (0, _debug["default"])('pie-lib:graphing:absolute');
17
+ var Absolute = (0, _withRootEdge.withRootEdge)(function (props) {
18
+ var root = props.root,
19
+ edge = props.edge,
20
+ graphProps = props.graphProps;
21
+ var domain = graphProps.domain,
22
+ range = graphProps.range;
23
+ var dataPoints = edge && edge.x === root.x ? [] : (0, _graphingUtils.buildDataPoints)(domain, range, root, edge, (0, _graphingUtils.absoluteFromTwoPoints)(root, edge), true);
24
+ log('dataPoints:', dataPoints);
25
+ return {
26
+ root: props.root,
27
+ edge: props.edge,
28
+ dataPoints: dataPoints,
29
+ enableCurve: false
30
+ };
31
+ });
32
+ var Component = (0, _withRootEdge.rootEdgeComponent)(Absolute);
33
+ var _default = Component;
34
+ exports["default"] = _default;
35
+ //# sourceMappingURL=component.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/tools/absolute/component.jsx"],"names":["log","Absolute","props","root","edge","graphProps","domain","range","dataPoints","x","enableCurve","Component"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AAEA,IAAMA,GAAG,GAAG,uBAAM,2BAAN,CAAZ;AAEA,IAAMC,QAAQ,GAAG,gCAAa,UAACC,KAAD,EAAW;AACvC,MAAQC,IAAR,GAAmCD,KAAnC,CAAQC,IAAR;AAAA,MAAcC,IAAd,GAAmCF,KAAnC,CAAcE,IAAd;AAAA,MAAoBC,UAApB,GAAmCH,KAAnC,CAAoBG,UAApB;AACA,MAAQC,MAAR,GAA0BD,UAA1B,CAAQC,MAAR;AAAA,MAAgBC,KAAhB,GAA0BF,UAA1B,CAAgBE,KAAhB;AAEA,MAAMC,UAAU,GACdJ,IAAI,IAAIA,IAAI,CAACK,CAAL,KAAWN,IAAI,CAACM,CAAxB,GACI,EADJ,GAEI,oCAAgBH,MAAhB,EAAwBC,KAAxB,EAA+BJ,IAA/B,EAAqCC,IAArC,EAA2C,0CAAsBD,IAAtB,EAA4BC,IAA5B,CAA3C,EAA8E,IAA9E,CAHN;AAKAJ,EAAAA,GAAG,CAAC,aAAD,EAAgBQ,UAAhB,CAAH;AAEA,SAAO;AAAEL,IAAAA,IAAI,EAAED,KAAK,CAACC,IAAd;AAAoBC,IAAAA,IAAI,EAAEF,KAAK,CAACE,IAAhC;AAAsCI,IAAAA,UAAU,EAAVA,UAAtC;AAAkDE,IAAAA,WAAW,EAAE;AAA/D,GAAP;AACD,CAZgB,CAAjB;AAcA,IAAMC,SAAS,GAAG,qCAAkBV,QAAlB,CAAlB;eAEeU,S","sourcesContent":["import debug from 'debug';\nimport { buildDataPoints, absoluteFromTwoPoints } from '@pie-lib/graphing-utils';\nimport { withRootEdge, rootEdgeComponent } from '../shared/line/with-root-edge';\n\nconst log = debug('pie-lib:graphing:absolute');\n\nconst Absolute = withRootEdge((props) => {\n const { root, edge, graphProps } = props;\n const { domain, range } = graphProps;\n\n const dataPoints =\n edge && edge.x === root.x\n ? []\n : buildDataPoints(domain, range, root, edge, absoluteFromTwoPoints(root, edge), true);\n\n log('dataPoints:', dataPoints);\n\n return { root: props.root, edge: props.edge, dataPoints, enableCurve: false };\n});\n\nconst Component = rootEdgeComponent(Absolute);\n\nexport default Component;\n"],"file":"component.js"}