@pie-lib/charting 6.0.0-next.0 → 6.1.0-next.2

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 (56) hide show
  1. package/CHANGELOG.md +40 -0
  2. package/package.json +7 -15
  3. package/lib/actions-button.js +0 -145
  4. package/lib/actions-button.js.map +0 -1
  5. package/lib/axes.js +0 -586
  6. package/lib/axes.js.map +0 -1
  7. package/lib/bars/bar.js +0 -58
  8. package/lib/bars/bar.js.map +0 -1
  9. package/lib/bars/common/bars.js +0 -277
  10. package/lib/bars/common/bars.js.map +0 -1
  11. package/lib/bars/common/correct-check-icon.js +0 -54
  12. package/lib/bars/common/correct-check-icon.js.map +0 -1
  13. package/lib/bars/histogram.js +0 -59
  14. package/lib/bars/histogram.js.map +0 -1
  15. package/lib/chart-setup.js +0 -382
  16. package/lib/chart-setup.js.map +0 -1
  17. package/lib/chart-type.js +0 -80
  18. package/lib/chart-type.js.map +0 -1
  19. package/lib/chart-types.js +0 -22
  20. package/lib/chart-types.js.map +0 -1
  21. package/lib/chart.js +0 -384
  22. package/lib/chart.js.map +0 -1
  23. package/lib/common/correctness-indicators.js +0 -156
  24. package/lib/common/correctness-indicators.js.map +0 -1
  25. package/lib/common/drag-handle.js +0 -160
  26. package/lib/common/drag-handle.js.map +0 -1
  27. package/lib/common/drag-icon.js +0 -52
  28. package/lib/common/drag-icon.js.map +0 -1
  29. package/lib/common/styles.js +0 -22
  30. package/lib/common/styles.js.map +0 -1
  31. package/lib/grid.js +0 -101
  32. package/lib/grid.js.map +0 -1
  33. package/lib/index.js +0 -42
  34. package/lib/index.js.map +0 -1
  35. package/lib/key-legend.js +0 -87
  36. package/lib/key-legend.js.map +0 -1
  37. package/lib/line/common/drag-handle.js +0 -146
  38. package/lib/line/common/drag-handle.js.map +0 -1
  39. package/lib/line/common/line.js +0 -214
  40. package/lib/line/common/line.js.map +0 -1
  41. package/lib/line/line-cross.js +0 -214
  42. package/lib/line/line-cross.js.map +0 -1
  43. package/lib/line/line-dot.js +0 -158
  44. package/lib/line/line-dot.js.map +0 -1
  45. package/lib/mark-label.js +0 -236
  46. package/lib/mark-label.js.map +0 -1
  47. package/lib/plot/common/plot.js +0 -349
  48. package/lib/plot/common/plot.js.map +0 -1
  49. package/lib/plot/dot.js +0 -110
  50. package/lib/plot/dot.js.map +0 -1
  51. package/lib/plot/line.js +0 -140
  52. package/lib/plot/line.js.map +0 -1
  53. package/lib/tool-menu.js +0 -106
  54. package/lib/tool-menu.js.map +0 -1
  55. package/lib/utils.js +0 -189
  56. package/lib/utils.js.map +0 -1
package/lib/axes.js DELETED
@@ -1,586 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports["default"] = exports.TickComponent = exports.RawChartAxes = void 0;
8
- var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
9
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
10
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
11
- var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
12
- var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
13
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
14
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
15
- var _react = _interopRequireDefault(require("react"));
16
- var _propTypes = _interopRequireDefault(require("prop-types"));
17
- var _styles = require("@mui/material/styles");
18
- var _axis = require("@visx/axis");
19
- var _Checkbox = _interopRequireDefault(require("@mui/material/Checkbox"));
20
- var _plot = require("@pie-lib/plot");
21
- var _renderUi = require("@pie-lib/render-ui");
22
- var _configUi = require("@pie-lib/config-ui");
23
- var _mathRendering = require("@pie-lib/math-rendering");
24
- var _correctnessIndicators = require("./common/correctness-indicators");
25
- var _utils = require("./utils");
26
- var _markLabel = _interopRequireDefault(require("./mark-label"));
27
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
28
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
29
- function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
30
- function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
31
- var StyledErrorText = (0, _styles.styled)('text')(function (_ref) {
32
- var theme = _ref.theme;
33
- return {
34
- fontSize: theme.typography.fontSize - 2,
35
- fill: theme.palette.error.main
36
- };
37
- });
38
- var StyledCheckbox = (0, _styles.styled)(_Checkbox["default"])(function () {
39
- return {
40
- color: "".concat(_renderUi.color.tertiary(), " !important")
41
- };
42
- });
43
- var StyledAxesGroup = (0, _styles.styled)('g')(function (_ref2) {
44
- var _theme$typography$bod;
45
- var theme = _ref2.theme;
46
- return {
47
- '& .vx-axis-line': {
48
- stroke: _renderUi.color.visualElementsColors.AXIS_LINE_COLOR,
49
- strokeWidth: 2
50
- },
51
- '& .vx-axis-tick': {
52
- fill: _renderUi.color.visualElementsColors.AXIS_TICK_COLOR,
53
- '& line': {
54
- stroke: _renderUi.color.visualElementsColors.AXIS_TICK_COLOR,
55
- strokeWidth: 2
56
- },
57
- fontFamily: (_theme$typography$bod = theme.typography.body1) === null || _theme$typography$bod === void 0 ? void 0 : _theme$typography$bod.fontFamily,
58
- fontSize: theme.typography.fontSize,
59
- textAnchor: 'middle'
60
- }
61
- };
62
- });
63
- var correctnessIconStyles = function correctnessIconStyles(theme) {
64
- return {
65
- borderRadius: theme.spacing(2),
66
- color: _renderUi.color.defaults.WHITE,
67
- fontSize: '16px',
68
- width: '16px',
69
- height: '16px',
70
- padding: '2px',
71
- border: "1px solid ".concat(_renderUi.color.defaults.WHITE),
72
- boxSizing: 'unset' // to override the default border-box in IBX
73
- };
74
- };
75
- var incorrectIconStyles = {
76
- backgroundColor: _renderUi.color.incorrectWithIcon()
77
- };
78
- var correctIconStyles = {
79
- backgroundColor: _renderUi.color.correct()
80
- };
81
- var TickComponent = exports.TickComponent = /*#__PURE__*/function (_React$Component) {
82
- function TickComponent(props) {
83
- var _this;
84
- (0, _classCallCheck2["default"])(this, TickComponent);
85
- _this = _callSuper(this, TickComponent, [props]);
86
- (0, _defineProperty2["default"])(_this, "handleAlertDialog", function (open, callback) {
87
- return _this.setState({
88
- dialog: {
89
- open: open
90
- }
91
- }, callback);
92
- });
93
- (0, _defineProperty2["default"])(_this, "changeCategory", function (index, newLabel) {
94
- var _this$props = _this.props,
95
- categories = _this$props.categories,
96
- onChangeCategory = _this$props.onChangeCategory;
97
- var category = categories[index];
98
- onChangeCategory(index, _objectSpread(_objectSpread({}, category), {}, {
99
- label: newLabel
100
- }));
101
- });
102
- (0, _defineProperty2["default"])(_this, "changeInteractive", function (index, value) {
103
- var _this$props2 = _this.props,
104
- categories = _this$props2.categories,
105
- onChangeCategory = _this$props2.onChangeCategory;
106
- var category = categories[index];
107
- if (!value) {
108
- _this.setState({
109
- dialog: {
110
- open: true,
111
- title: 'Warning',
112
- text: 'This will remove the correct answer value that has been defined for this category.',
113
- onConfirm: function onConfirm() {
114
- return _this.handleAlertDialog(false, onChangeCategory(index, _objectSpread(_objectSpread({}, category), {}, {
115
- interactive: !category.interactive
116
- })));
117
- },
118
- onClose: function onClose() {
119
- return _this.handleAlertDialog(false);
120
- }
121
- }
122
- });
123
- } else {
124
- onChangeCategory(index, _objectSpread(_objectSpread({}, category), {}, {
125
- interactive: !category.interactive
126
- }));
127
- }
128
- });
129
- (0, _defineProperty2["default"])(_this, "changeEditable", function (index, value) {
130
- var _this$props3 = _this.props,
131
- categories = _this$props3.categories,
132
- onChangeCategory = _this$props3.onChangeCategory;
133
- var category = categories[index];
134
- if (!value) {
135
- _this.setState({
136
- dialog: {
137
- open: true,
138
- title: 'Warning',
139
- text: 'This will remove the correct answer category name that has been defined for this category.',
140
- onConfirm: function onConfirm() {
141
- return _this.handleAlertDialog(false, onChangeCategory(index, _objectSpread(_objectSpread({}, category), {}, {
142
- editable: !category.editable || false
143
- })));
144
- },
145
- onClose: function onClose() {
146
- return _this.handleAlertDialog(false);
147
- }
148
- }
149
- });
150
- } else {
151
- onChangeCategory(index, _objectSpread(_objectSpread({}, category), {}, {
152
- editable: !category.editable || false
153
- }));
154
- }
155
- });
156
- (0, _defineProperty2["default"])(_this, "splitText", function (text, maxChar) {
157
- var chunks = [];
158
- while ((text || '').length > 0) {
159
- var indexToSplit = void 0;
160
- if (text.length > maxChar) {
161
- indexToSplit = text.lastIndexOf(' ', maxChar);
162
- if (indexToSplit === -1) {
163
- indexToSplit = maxChar;
164
- }
165
- } else {
166
- indexToSplit = text.length;
167
- }
168
- chunks.push(text.substring(0, indexToSplit));
169
- text = text.substring(indexToSplit).trim();
170
- }
171
- return chunks;
172
- });
173
- _this.state = {
174
- dialog: {
175
- open: false
176
- }
177
- };
178
- return _this;
179
- }
180
- (0, _inherits2["default"])(TickComponent, _React$Component);
181
- return (0, _createClass2["default"])(TickComponent, [{
182
- key: "componentDidUpdate",
183
- value: function componentDidUpdate(prevProps) {
184
- if (this.props.autoFocus && !prevProps.autoFocus) {
185
- this.props.onAutoFocusUsed();
186
- }
187
- }
188
- }, {
189
- key: "render",
190
- value: function render() {
191
- var _this2 = this;
192
- var _this$props4 = this.props,
193
- categories = _this$props4.categories,
194
- xBand = _this$props4.xBand,
195
- bandWidth = _this$props4.bandWidth,
196
- barWidth = _this$props4.barWidth,
197
- rotate = _this$props4.rotate,
198
- top = _this$props4.top,
199
- graphProps = _this$props4.graphProps,
200
- defineChart = _this$props4.defineChart,
201
- chartingOptions = _this$props4.chartingOptions,
202
- x = _this$props4.x,
203
- y = _this$props4.y,
204
- formattedValue = _this$props4.formattedValue,
205
- changeInteractiveEnabled = _this$props4.changeInteractiveEnabled,
206
- changeEditableEnabled = _this$props4.changeEditableEnabled,
207
- error = _this$props4.error,
208
- autoFocus = _this$props4.autoFocus,
209
- hiddenLabelRef = _this$props4.hiddenLabelRef,
210
- showCorrectness = _this$props4.showCorrectness;
211
- if (!formattedValue) {
212
- return null;
213
- }
214
-
215
- // Create classes object for TickCorrectnessIndicator compatibility
216
- var classes = {
217
- correctnessIcon: correctnessIconStyles,
218
- incorrectIcon: incorrectIconStyles,
219
- correctIcon: correctIconStyles
220
- };
221
- var dialog = this.state.dialog;
222
- var _ref3 = chartingOptions || {},
223
- changeEditable = _ref3.changeEditable,
224
- changeInteractive = _ref3.changeInteractive;
225
- var index = parseInt(formattedValue.split('-')[0], 10);
226
- var category = categories[index];
227
- var _ref4 = category || {},
228
- editable = _ref4.editable,
229
- interactive = _ref4.interactive,
230
- label = _ref4.label,
231
- correctness = _ref4.correctness;
232
- var barX = xBand((0, _utils.bandKey)({
233
- label: label
234
- }, index));
235
- var longestCategory = (categories || []).reduce(function (a, b) {
236
- var lengthA = a && a.label ? a.label.length : 0;
237
- var lengthB = b && b.label ? b.label.length : 0;
238
- return lengthA > lengthB ? a : b;
239
- }, {
240
- label: ''
241
- });
242
- var distinctMessages = error ? (0, _toConsumableArray2["default"])(new Set(Object.values(error))).join(' ') : '';
243
- return /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("foreignObject", {
244
- x: bandWidth ? barX : x - barWidth / 2,
245
- y: 18,
246
- width: barWidth,
247
- height: 4,
248
- style: {
249
- pointerEvents: 'none',
250
- overflow: 'visible'
251
- }
252
- }, index === 0 && /*#__PURE__*/_react["default"].createElement(_markLabel["default"], {
253
- isHiddenLabel: true,
254
- inputRef: hiddenLabelRef,
255
- disabled: true,
256
- mark: longestCategory,
257
- graphProps: graphProps,
258
- barWidth: barWidth
259
- }), /*#__PURE__*/_react["default"].createElement(_markLabel["default"], {
260
- autoFocus: defineChart && autoFocus,
261
- inputRef: function inputRef(r) {
262
- return _this2.input = r;
263
- },
264
- disabled: !defineChart && !editable,
265
- mark: category,
266
- graphProps: graphProps,
267
- onChange: function onChange(newLabel) {
268
- return _this2.changeCategory(index, newLabel);
269
- },
270
- barWidth: barWidth,
271
- rotate: rotate,
272
- correctness: correctness,
273
- error: error && error[index],
274
- limitCharacters: true,
275
- correctnessIndicator: showCorrectness && correctness && /*#__PURE__*/_react["default"].createElement(_correctnessIndicators.TickCorrectnessIndicator, {
276
- correctness: correctness,
277
- interactive: interactive,
278
- classes: classes
279
- })
280
- })), error && index === 0 && /*#__PURE__*/_react["default"].createElement(StyledErrorText, {
281
- y: y + 23,
282
- height: 6,
283
- textAnchor: "start"
284
- }, distinctMessages), defineChart && index === 0 && /*#__PURE__*/_react["default"].createElement("svg", {
285
- x: -55,
286
- style: {
287
- overflow: 'visible'
288
- }
289
- }, changeInteractiveEnabled && /*#__PURE__*/_react["default"].createElement("text", {
290
- y: y + 90 + top,
291
- width: barWidth,
292
- height: 4,
293
- style: {
294
- position: 'absolute',
295
- pointerEvents: 'none',
296
- wordBreak: 'break-word',
297
- maxWidth: barWidth,
298
- display: 'inline-block'
299
- }
300
- }, this.splitText(changeInteractive === null || changeInteractive === void 0 ? void 0 : changeInteractive.authoringLabel, 20).map(function (word, index) {
301
- return /*#__PURE__*/_react["default"].createElement("tspan", {
302
- key: index,
303
- x: "0",
304
- dy: "".concat(index > 0 ? '1.2em' : '.6em')
305
- }, word);
306
- })), changeEditableEnabled && /*#__PURE__*/_react["default"].createElement("text", {
307
- y: y + 145 + top,
308
- width: barWidth,
309
- height: 4,
310
- style: {
311
- position: 'absolute',
312
- pointerEvents: 'none',
313
- wordBreak: 'break-word',
314
- maxWidth: barWidth,
315
- display: 'inline-block'
316
- }
317
- }, this.splitText(changeEditable === null || changeEditable === void 0 ? void 0 : changeEditable.authoringLabel, 20).map(function (word, index) {
318
- return /*#__PURE__*/_react["default"].createElement("tspan", {
319
- key: index,
320
- x: "0",
321
- dy: "".concat(index > 0 ? '1.2em' : '.6em')
322
- }, word);
323
- }))), defineChart && changeInteractiveEnabled && /*#__PURE__*/_react["default"].createElement("foreignObject", {
324
- x: x - 24,
325
- y: y + 80 + top,
326
- width: barWidth,
327
- height: 4,
328
- style: {
329
- pointerEvents: 'visible',
330
- overflow: 'visible'
331
- }
332
- }, /*#__PURE__*/_react["default"].createElement(StyledCheckbox, {
333
- style: {
334
- position: 'fixed'
335
- },
336
- checked: interactive,
337
- onChange: function onChange(e) {
338
- return _this2.changeInteractive(index, e.target.checked);
339
- }
340
- })), defineChart && changeEditableEnabled && /*#__PURE__*/_react["default"].createElement("foreignObject", {
341
- x: x - 24,
342
- y: y + 130 + top,
343
- width: barWidth,
344
- height: 4,
345
- style: {
346
- pointerEvents: 'visible',
347
- overflow: 'visible'
348
- }
349
- }, /*#__PURE__*/_react["default"].createElement(StyledCheckbox, {
350
- style: {
351
- position: 'fixed'
352
- },
353
- checked: editable,
354
- onChange: function onChange(e) {
355
- return _this2.changeEditable(index, e.target.checked);
356
- }
357
- })), /*#__PURE__*/_react["default"].createElement("foreignObject", {
358
- x: x - 24,
359
- y: y + 100 + top,
360
- width: barWidth,
361
- height: 4,
362
- style: {
363
- pointerEvents: 'visible',
364
- overflow: 'visible'
365
- }
366
- }, /*#__PURE__*/_react["default"].createElement(_configUi.AlertDialog, {
367
- open: dialog.open,
368
- title: dialog.title,
369
- text: dialog.text,
370
- onClose: dialog.onClose,
371
- onConfirm: dialog.onConfirm
372
- })));
373
- }
374
- }]);
375
- }(_react["default"].Component);
376
- (0, _defineProperty2["default"])(TickComponent, "propTypes", {
377
- defineChart: _propTypes["default"].bool,
378
- error: _propTypes["default"].any
379
- });
380
- TickComponent.propTypes = {
381
- categories: _propTypes["default"].array,
382
- xBand: _propTypes["default"].func,
383
- bandWidth: _propTypes["default"].number,
384
- barWidth: _propTypes["default"].number,
385
- rotate: _propTypes["default"].number,
386
- top: _propTypes["default"].number,
387
- x: _propTypes["default"].number,
388
- y: _propTypes["default"].number,
389
- graphProps: _propTypes["default"].object,
390
- formattedValue: _propTypes["default"].string,
391
- onChangeCategory: _propTypes["default"].func,
392
- onChange: _propTypes["default"].func,
393
- error: _propTypes["default"].object,
394
- defineChart: _propTypes["default"].bool,
395
- chartingOptions: _propTypes["default"].object,
396
- changeInteractiveEnabled: _propTypes["default"].bool,
397
- changeEditableEnabled: _propTypes["default"].bool,
398
- autoFocus: _propTypes["default"].bool,
399
- onAutoFocusUsed: _propTypes["default"].func,
400
- showCorrectness: _propTypes["default"].bool,
401
- hiddenLabelRef: _propTypes["default"].oneOfType([_propTypes["default"].func, _propTypes["default"].shape({
402
- current: _propTypes["default"].instanceOf(Element)
403
- })])
404
- };
405
- var RawChartAxes = exports.RawChartAxes = /*#__PURE__*/function (_React$Component2) {
406
- function RawChartAxes() {
407
- var _this3;
408
- (0, _classCallCheck2["default"])(this, RawChartAxes);
409
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
410
- args[_key] = arguments[_key];
411
- }
412
- _this3 = _callSuper(this, RawChartAxes, [].concat(args));
413
- (0, _defineProperty2["default"])(_this3, "state", {
414
- height: 0,
415
- width: 0
416
- });
417
- return _this3;
418
- }
419
- (0, _inherits2["default"])(RawChartAxes, _React$Component2);
420
- return (0, _createClass2["default"])(RawChartAxes, [{
421
- key: "componentDidMount",
422
- value: function componentDidMount() {
423
- if (this.hiddenLabelRef) {
424
- var boundingClientRect = this.hiddenLabelRef.getBoundingClientRect();
425
- var hiddenEl = this.hiddenLabelRef;
426
-
427
- // same logic used in dropdown.jsx for hidden labels width calculation
428
- if (hiddenEl) {
429
- var containsLatex = hiddenEl.querySelector('[data-latex], [data-raw]');
430
- var hasMathJax = hiddenEl.querySelector('mjx-container');
431
- var mathHandled = hiddenEl.querySelector('[data-math-handled="true"]');
432
- if (containsLatex && (!mathHandled || !hasMathJax)) {
433
- (0, _mathRendering.renderMath)(this.hiddenLabelRef);
434
- }
435
- this.setState({
436
- height: Math.floor(boundingClientRect.height),
437
- width: Math.floor(boundingClientRect.width)
438
- });
439
- }
440
- }
441
- }
442
- }, {
443
- key: "componentDidUpdate",
444
- value: function componentDidUpdate() {
445
- if (this.hiddenLabelRef) {
446
- var width = Math.floor(this.hiddenLabelRef.getBoundingClientRect().width);
447
- if (width !== this.state.width) {
448
- this.setState({
449
- width: width
450
- });
451
- }
452
- }
453
- }
454
- }, {
455
- key: "render",
456
- value: function render() {
457
- var _this4 = this;
458
- var _this$props5 = this.props,
459
- graphProps = _this$props5.graphProps,
460
- xBand = _this$props5.xBand,
461
- leftAxis = _this$props5.leftAxis,
462
- onChange = _this$props5.onChange,
463
- onChangeCategory = _this$props5.onChangeCategory,
464
- _this$props5$categori = _this$props5.categories,
465
- categories = _this$props5$categori === void 0 ? [] : _this$props5$categori,
466
- top = _this$props5.top,
467
- defineChart = _this$props5.defineChart,
468
- chartingOptions = _this$props5.chartingOptions,
469
- changeInteractiveEnabled = _this$props5.changeInteractiveEnabled,
470
- changeEditableEnabled = _this$props5.changeEditableEnabled,
471
- theme = _this$props5.theme,
472
- autoFocus = _this$props5.autoFocus,
473
- onAutoFocusUsed = _this$props5.onAutoFocusUsed,
474
- error = _this$props5.error,
475
- showCorrectness = _this$props5.showCorrectness;
476
- var _ref5 = graphProps || {},
477
- _ref5$scale = _ref5.scale,
478
- scale = _ref5$scale === void 0 ? {} : _ref5$scale,
479
- _ref5$range = _ref5.range,
480
- range = _ref5$range === void 0 ? {} : _ref5$range,
481
- _ref5$domain = _ref5.domain,
482
- domain = _ref5$domain === void 0 ? {} : _ref5$domain,
483
- _ref5$size = _ref5.size,
484
- size = _ref5$size === void 0 ? {} : _ref5$size;
485
- var _this$state = this.state,
486
- height = _this$state.height,
487
- width = _this$state.width;
488
- var bottomScale = xBand && typeof xBand.rangeRound === 'function' && xBand.rangeRound([0, size.width]);
489
- var bandWidth = xBand && typeof xBand.bandwidth === 'function' && xBand.bandwidth();
490
- // for chartType "line", bandWidth will be 0, so we have to calculate it
491
- var barWidth = bandWidth || scale.x && scale.x(domain.max) / categories.length;
492
- var rowTickValues = (0, _utils.getTickValues)(_objectSpread(_objectSpread({}, range), {}, {
493
- step: range.labelStep
494
- }));
495
- var fontSize = theme && theme.typography ? theme.typography.fontSize : 14;
496
- // this mostly applies for labels that are not editable
497
- var rotateBecauseOfHeight = (0, _utils.getRotateAngle)(fontSize, height);
498
- // this applies for labels that are editable
499
- var rotateBecauseOfWidth = width > barWidth ? 25 : 0;
500
- var getTickLabelProps = function getTickLabelProps(value) {
501
- return {
502
- dy: 4,
503
- dx: -10 - (value.toLocaleString().length || 1) * 5
504
- };
505
- };
506
- var getTickComponent = function getTickComponent(props) {
507
- var properties = {
508
- hiddenLabelRef: function hiddenLabelRef(ref) {
509
- _this4.hiddenLabelRef = ref;
510
- },
511
- categories: categories,
512
- xBand: xBand,
513
- bandWidth: bandWidth,
514
- barWidth: barWidth,
515
- rotate: rotateBecauseOfHeight || rotateBecauseOfWidth,
516
- top: top,
517
- defineChart: defineChart,
518
- chartingOptions: chartingOptions,
519
- autoFocus: autoFocus,
520
- onAutoFocusUsed: onAutoFocusUsed,
521
- error: error,
522
- onChangeCategory: onChangeCategory,
523
- changeInteractiveEnabled: changeInteractiveEnabled,
524
- changeEditableEnabled: changeEditableEnabled,
525
- onChange: onChange,
526
- graphProps: graphProps,
527
- x: props.x,
528
- y: props.y,
529
- formattedValue: props.formattedValue,
530
- showCorrectness: showCorrectness
531
- };
532
- return /*#__PURE__*/_react["default"].createElement(TickComponent, properties);
533
- };
534
- return /*#__PURE__*/_react["default"].createElement(StyledAxesGroup, null, leftAxis && /*#__PURE__*/_react["default"].createElement(_axis.AxisLeft, {
535
- scale: scale.y,
536
- tickLength: 10,
537
- tickFormat: function tickFormat(value) {
538
- return value;
539
- },
540
- tickValues: rowTickValues,
541
- tickLabelProps: getTickLabelProps
542
- }), /*#__PURE__*/_react["default"].createElement(_axis.AxisBottom, {
543
- scale: bottomScale,
544
- labelProps: {
545
- y: 60 + top
546
- },
547
- top: scale.y && scale.y(range.min),
548
- textLabelProps: function textLabelProps() {
549
- return {
550
- textAnchor: 'middle'
551
- };
552
- },
553
- tickFormat: function tickFormat(count) {
554
- return count;
555
- },
556
- tickComponent: getTickComponent,
557
- autoFocus: autoFocus,
558
- onAutoFocusUsed: onAutoFocusUsed
559
- }));
560
- }
561
- }]);
562
- }(_react["default"].Component);
563
- (0, _defineProperty2["default"])(RawChartAxes, "propTypes", {
564
- bottomScale: _propTypes["default"].func,
565
- categories: _propTypes["default"].array,
566
- defineChart: _propTypes["default"].bool,
567
- error: _propTypes["default"].any,
568
- graphProps: _plot.types.GraphPropsType.isRequired,
569
- xBand: _propTypes["default"].func,
570
- leftAxis: _propTypes["default"].bool,
571
- onChange: _propTypes["default"].func,
572
- onChangeCategory: _propTypes["default"].func,
573
- top: _propTypes["default"].number,
574
- theme: _propTypes["default"].object,
575
- chartingOptions: _propTypes["default"].object,
576
- changeInteractiveEnabled: _propTypes["default"].bool,
577
- changeEditableEnabled: _propTypes["default"].bool,
578
- autoFocus: _propTypes["default"].bool,
579
- onAutoFocusUsed: _propTypes["default"].func,
580
- showCorrectness: _propTypes["default"].bool,
581
- hiddenLabelRef: _propTypes["default"].oneOfType([_propTypes["default"].func, _propTypes["default"].shape({
582
- current: _propTypes["default"].instanceOf(Element)
583
- })])
584
- });
585
- var _default = exports["default"] = RawChartAxes;
586
- //# sourceMappingURL=axes.js.map