@pie-lib/charting 4.5.11-next.548 → 4.5.11-next.578
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.
- package/lib/axes.js +78 -15
- package/lib/axes.js.map +1 -1
- package/lib/chart-setup.js +25 -9
- package/lib/chart-setup.js.map +1 -1
- package/lib/mark-label.js +5 -4
- package/lib/mark-label.js.map +1 -1
- package/package.json +3 -3
- package/src/axes.jsx +70 -2
- package/src/chart-setup.jsx +46 -33
- package/src/mark-label.jsx +1 -2
package/lib/axes.js
CHANGED
|
@@ -33,6 +33,8 @@ var _plot = require("@pie-lib/plot");
|
|
|
33
33
|
|
|
34
34
|
var _renderUi = require("@pie-lib/render-ui");
|
|
35
35
|
|
|
36
|
+
var _configUi = require("@pie-lib/config-ui");
|
|
37
|
+
|
|
36
38
|
var _axis = require("@vx/axis");
|
|
37
39
|
|
|
38
40
|
var _utils = require("./utils");
|
|
@@ -54,16 +56,18 @@ var TickComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
54
56
|
|
|
55
57
|
var _super = _createSuper(TickComponent);
|
|
56
58
|
|
|
57
|
-
function TickComponent() {
|
|
59
|
+
function TickComponent(props) {
|
|
58
60
|
var _this;
|
|
59
61
|
|
|
60
62
|
(0, _classCallCheck2["default"])(this, TickComponent);
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
63
|
+
_this = _super.call(this, props);
|
|
64
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleAlertDialog", function (open, callback) {
|
|
65
|
+
return _this.setState({
|
|
66
|
+
dialog: {
|
|
67
|
+
open: open
|
|
68
|
+
}
|
|
69
|
+
}, callback);
|
|
70
|
+
});
|
|
67
71
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeCategory", function (index, newLabel) {
|
|
68
72
|
var _this$props = _this.props,
|
|
69
73
|
categories = _this$props.categories,
|
|
@@ -87,19 +91,62 @@ var TickComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
87
91
|
categories = _this$props3.categories,
|
|
88
92
|
onChangeCategory = _this$props3.onChangeCategory;
|
|
89
93
|
var category = categories[index];
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
94
|
+
|
|
95
|
+
if (!value) {
|
|
96
|
+
_this.setState({
|
|
97
|
+
dialog: {
|
|
98
|
+
open: true,
|
|
99
|
+
title: 'Warning',
|
|
100
|
+
text: 'This will remove the correct answer value that has been defined for this category.',
|
|
101
|
+
onConfirm: function onConfirm() {
|
|
102
|
+
return _this.handleAlertDialog(false, onChangeCategory(index, _objectSpread(_objectSpread({}, category), {}, {
|
|
103
|
+
interactive: !category.interactive
|
|
104
|
+
})));
|
|
105
|
+
},
|
|
106
|
+
onClose: function onClose() {
|
|
107
|
+
return _this.handleAlertDialog(false);
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
});
|
|
111
|
+
} else {
|
|
112
|
+
onChangeCategory(index, _objectSpread(_objectSpread({}, category), {}, {
|
|
113
|
+
interactive: !category.interactive
|
|
114
|
+
}));
|
|
115
|
+
}
|
|
93
116
|
});
|
|
94
117
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeEditable", function (index, value) {
|
|
95
118
|
var _this$props4 = _this.props,
|
|
96
119
|
categories = _this$props4.categories,
|
|
97
120
|
onChangeCategory = _this$props4.onChangeCategory;
|
|
98
121
|
var category = categories[index];
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
122
|
+
|
|
123
|
+
if (!value) {
|
|
124
|
+
_this.setState({
|
|
125
|
+
dialog: {
|
|
126
|
+
open: true,
|
|
127
|
+
title: 'Warning',
|
|
128
|
+
text: 'This will remove the correct answer category name that has been defined for this category.',
|
|
129
|
+
onConfirm: function onConfirm() {
|
|
130
|
+
return _this.handleAlertDialog(false, onChangeCategory(index, _objectSpread(_objectSpread({}, category), {}, {
|
|
131
|
+
editable: !category.editable || false
|
|
132
|
+
})));
|
|
133
|
+
},
|
|
134
|
+
onClose: function onClose() {
|
|
135
|
+
return _this.handleAlertDialog(false);
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
});
|
|
139
|
+
} else {
|
|
140
|
+
onChangeCategory(index, _objectSpread(_objectSpread({}, category), {}, {
|
|
141
|
+
editable: !category.editable || false
|
|
142
|
+
}));
|
|
143
|
+
}
|
|
102
144
|
});
|
|
145
|
+
_this.state = {
|
|
146
|
+
dialog: {
|
|
147
|
+
open: false
|
|
148
|
+
}
|
|
149
|
+
};
|
|
103
150
|
return _this;
|
|
104
151
|
}
|
|
105
152
|
|
|
@@ -126,6 +173,7 @@ var TickComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
126
173
|
return null;
|
|
127
174
|
}
|
|
128
175
|
|
|
176
|
+
var dialog = this.state.dialog;
|
|
129
177
|
var index = parseInt(formattedValue.split('-')[0], 10);
|
|
130
178
|
var category = categories[index];
|
|
131
179
|
|
|
@@ -265,6 +313,21 @@ var TickComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
265
313
|
onChange: function onChange(e) {
|
|
266
314
|
return _this2.changeEditable(index, e.target.checked);
|
|
267
315
|
}
|
|
316
|
+
})), /*#__PURE__*/_react["default"].createElement("foreignObject", {
|
|
317
|
+
x: x - 24,
|
|
318
|
+
y: y + 100 + top,
|
|
319
|
+
width: barWidth,
|
|
320
|
+
height: 4,
|
|
321
|
+
style: {
|
|
322
|
+
pointerEvents: 'visible',
|
|
323
|
+
overflow: 'visible'
|
|
324
|
+
}
|
|
325
|
+
}, /*#__PURE__*/_react["default"].createElement(_configUi.AlertDialog, {
|
|
326
|
+
open: dialog.open,
|
|
327
|
+
title: dialog.title,
|
|
328
|
+
text: dialog.text,
|
|
329
|
+
onClose: dialog.onClose,
|
|
330
|
+
onConfirm: dialog.onConfirm
|
|
268
331
|
})));
|
|
269
332
|
}
|
|
270
333
|
}]);
|
|
@@ -298,8 +361,8 @@ var RawChartAxes = /*#__PURE__*/function (_React$Component2) {
|
|
|
298
361
|
|
|
299
362
|
(0, _classCallCheck2["default"])(this, RawChartAxes);
|
|
300
363
|
|
|
301
|
-
for (var
|
|
302
|
-
args[
|
|
364
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
365
|
+
args[_key] = arguments[_key];
|
|
303
366
|
}
|
|
304
367
|
|
|
305
368
|
_this3 = _super2.call.apply(_super2, [this].concat(args));
|
package/lib/axes.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"axes.js","names":["TickComponent","index","newLabel","props","categories","onChangeCategory","category","label","onChange","slice","value","interactive","editable","classes","xBand","bandWidth","barWidth","rotate","top","graphProps","defineChart","x","y","formattedValue","parseInt","split","deletable","correctness","autoFocus","inDefineChart","barX","bandKey","longestCategory","reduce","a","b","lengthA","length","lengthB","longestLabel","pointerEvents","overflow","position","visibility","wordBreak","maxWidth","display","r","input","changeCategory","dottedLine","deleteCategory","e","changeInteractive","target","checked","changeEditable","React","Component","propTypes","PropTypes","array","func","number","object","string","RawChartAxes","height","document","getElementById","offsetHeight","setState","leftAxis","theme","axis","axisLine","tick","axisLabel","scale","range","domain","size","state","bottomScale","rangeRound","width","bandwidth","max","rowTickValues","getTickValues","step","labelStep","fontSize","typography","getRotateAngle","getTickLabelProps","dy","dx","toLocaleString","getTickComponent","properties","min","textAnchor","count","isRequired","types","GraphPropsType","bool","ChartAxes","withStyles","fontFamily","body1","fill","color","secondary","stroke","primaryDark","strokeWidth","primaryLight","opacity","withTheme"],"sources":["../src/axes.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport { types } from '@pie-lib/plot';\nimport { color } from '@pie-lib/render-ui';\nimport { AxisLeft, AxisBottom } from '@vx/axis';\nimport { bandKey, getTickValues, getRotateAngle } from './utils';\nimport MarkLabel from './mark-label';\nimport Checkbox from '@material-ui/core/Checkbox';\n\nexport class TickComponent extends React.Component {\n changeCategory = (index, newLabel) => {\n const { categories, onChangeCategory } = this.props;\n const category = categories[index];\n\n onChangeCategory(index, { ...category, label: newLabel });\n };\n\n deleteCategory = index => {\n const { categories, onChange } = this.props;\n\n if (index >= 0 && categories[index]) {\n onChange([...categories.slice(0, index), ...categories.slice(index + 1)]);\n }\n };\n\n changeInteractive = (index, value) => {\n const { categories, onChangeCategory } = this.props;\n const category = categories[index];\n\n onChangeCategory(index, { ...category, interactive: !category.interactive });\n };\n\n changeEditable = (index, value) => {\n const { categories, onChangeCategory } = this.props;\n const category = categories[index];\n\n onChangeCategory(index, { ...category, editable: !category.editable || false });\n };\n\n render() {\n const {\n classes,\n categories,\n xBand,\n bandWidth,\n barWidth,\n rotate,\n top,\n graphProps,\n defineChart,\n x,\n y,\n formattedValue\n } = this.props;\n\n if (!formattedValue) {\n return null;\n }\n\n const index = parseInt(formattedValue.split('-')[0], 10);\n const category = categories[index];\n const { deletable, editable, interactive, label, correctness, autoFocus, inDefineChart } =\n category || {};\n const barX = xBand(bandKey({ label }, index));\n const longestCategory = (categories || []).reduce((a, b) => {\n const lengthA = a && a.label ? a.label.length : 0;\n const lengthB = b && b.label ? b.label.length : 0;\n\n return lengthA > lengthB ? a : b;\n });\n\n const longestLabel = (longestCategory && longestCategory.label) || '';\n\n return (\n <g>\n <foreignObject\n x={bandWidth ? barX : x - barWidth / 2}\n y={6}\n width={barWidth}\n height={4}\n style={{ pointerEvents: 'none', overflow: 'visible' }}\n >\n {index === 0 && (\n <div\n id=\"hiddenLabel\"\n style={{\n position: 'absolute',\n visibility: 'hidden',\n wordBreak: 'break-word',\n overflow: 'visible',\n maxWidth: barWidth,\n display: 'block'\n }}\n >\n {longestLabel}\n </div>\n )}\n <MarkLabel\n autoFocus={inDefineChart ? defineChart && autoFocus : autoFocus}\n inputRef={r => (this.input = r)}\n disabled={!defineChart && !editable}\n mark={category}\n graphProps={graphProps}\n onChange={newLabel => this.changeCategory(index, newLabel)}\n barWidth={barWidth}\n rotate={rotate}\n correctness={correctness}\n />\n </foreignObject>\n {deletable && !correctness && (\n <line\n x1={x}\n y1={0}\n x2={x}\n y2={y + 4 + top}\n className={classes.dottedLine}\n strokeDasharray=\"4 2\"\n />\n )}\n {deletable && !correctness && (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n x={x - 8}\n y={y + 10 + top}\n width={16}\n height={16}\n viewBox=\"0 0 512 512\"\n onClick={() => this.deleteCategory(index)}\n >\n <path d=\"M128 405.429C128 428.846 147.198 448 170.667 448h170.667C364.802 448 384 428.846 384 405.429V160H128v245.429zM416 96h-80l-26.785-32H202.786L176 96H96v32h320V96z\" />\n </svg>\n )}\n {defineChart && index === 0 && (\n <text\n x={x - 80}\n y={y + 40 + top}\n width={barWidth}\n height={4}\n style={{\n position: 'absolute',\n pointerEvents: 'none',\n wordBreak: 'break-word',\n overflow: 'visible',\n maxWidth: barWidth,\n display: 'inline-block'\n }}\n >\n <tspan x=\"0\" dy=\".6em\">\n {' '}\n Student can{' '}\n </tspan>\n <tspan x=\"0\" dy=\"1.2em\">\n {' '}\n set value\n </tspan>\n </text>\n )}\n {defineChart && index === 0 && (\n <text\n x={x - 80}\n y={y + 80 + top}\n width={barWidth}\n height={4}\n style={{\n position: 'absolute',\n pointerEvents: 'none',\n wordBreak: 'break-word',\n overflow: 'visible',\n maxWidth: barWidth,\n display: 'inline-block'\n }}\n >\n <tspan x=\"0\" dy=\".6em\">\n {' '}\n Student can{' '}\n </tspan>\n <tspan x=\"0\" dy=\"1.2em\">\n {' '}\n edit name\n </tspan>\n </text>\n )}\n {defineChart && (\n <foreignObject\n x={x - 24}\n y={y + 20 + top}\n width={barWidth}\n height={4}\n style={{ pointerEvents: 'visible', overflow: 'visible' }}\n >\n <Checkbox\n checked={interactive}\n onChange={e => this.changeInteractive(index, e.target.checked)}\n />\n </foreignObject>\n )}\n {defineChart && (\n <foreignObject\n x={x - 24}\n y={y + 70 + top}\n width={barWidth}\n height={4}\n style={{ pointerEvents: 'visible', overflow: 'visible' }}\n >\n <Checkbox\n checked={editable}\n onChange={e => this.changeEditable(index, e.target.checked)}\n />\n </foreignObject>\n )}\n </g>\n );\n }\n}\n\nTickComponent.propTypes = {\n categories: PropTypes.array,\n xBand: PropTypes.func,\n bandWidth: PropTypes.number,\n barWidth: PropTypes.number,\n rotate: PropTypes.number,\n top: PropTypes.number,\n x: PropTypes.number,\n y: PropTypes.number,\n graphProps: PropTypes.object,\n formattedValue: PropTypes.string,\n onChangeCategory: PropTypes.func,\n onChange: PropTypes.func,\n classes: PropTypes.object\n};\n\nexport class RawChartAxes extends React.Component {\n static propTypes = {\n bottomScale: PropTypes.func,\n classes: PropTypes.object.isRequired,\n categories: PropTypes.array,\n graphProps: types.GraphPropsType.isRequired,\n xBand: PropTypes.func,\n leftAxis: PropTypes.bool,\n onChange: PropTypes.func,\n onChangeCategory: PropTypes.func,\n top: PropTypes.number,\n theme: PropTypes.object\n };\n\n state = { height: 0 };\n\n componentDidMount() {\n const height = document.getElementById('hiddenLabel')\n ? document.getElementById('hiddenLabel').offsetHeight\n : 0;\n\n this.setState({ height });\n }\n\n render() {\n const {\n classes,\n graphProps,\n xBand,\n leftAxis,\n onChange,\n onChangeCategory,\n categories = [],\n top,\n defineChart,\n theme\n } = this.props;\n\n const { axis, axisLine, tick, axisLabel } = classes;\n const { scale = {}, range = {}, domain = {}, size = {} } = graphProps || {};\n const { height } = this.state;\n\n const bottomScale =\n xBand && typeof xBand.rangeRound === 'function' && xBand.rangeRound([0, size.width]);\n\n const bandWidth = xBand && typeof xBand.bandwidth === 'function' && xBand.bandwidth();\n // for chartType \"line\", bandWidth will be 0, so we have to calculate it\n const barWidth = bandWidth || (scale.x && scale.x(domain.max) / categories.length);\n\n const rowTickValues = getTickValues({ ...range, step: range.labelStep });\n const fontSize = theme && theme.typography ? theme.typography.fontSize : 14;\n const rotate = getRotateAngle(fontSize, height);\n\n const getTickLabelProps = value => ({\n dy: 4,\n dx: -10 - (value.toLocaleString().length || 1) * 5\n });\n\n const getTickComponent = props => {\n const properties = {\n classes,\n categories,\n xBand,\n bandWidth,\n barWidth,\n rotate,\n top,\n defineChart,\n onChangeCategory,\n onChange,\n graphProps,\n x: props.x,\n y: props.y,\n formattedValue: props.formattedValue\n };\n\n return <TickComponent {...properties} />;\n };\n\n return (\n <React.Fragment>\n {leftAxis && (\n <AxisLeft\n scale={scale.y}\n className={axis}\n axisLineClassName={axisLine}\n tickLength={10}\n tickClassName={tick}\n tickFormat={value => value}\n label={range.label}\n labelClassName={axisLabel}\n tickValues={rowTickValues}\n tickLabelProps={getTickLabelProps}\n />\n )}\n <AxisBottom\n axisLineClassName={axisLine}\n labelClassName={axisLabel}\n tickClassName={tick}\n scale={bottomScale}\n label={domain.label}\n labelProps={{ y: 60 + top }}\n top={scale.y && scale.y(range.min)}\n textLabelProps={() => ({ textAnchor: 'middle' })}\n tickFormat={count => count}\n tickComponent={getTickComponent}\n />\n </React.Fragment>\n );\n }\n}\n\nconst ChartAxes = withStyles(\n theme => ({\n axisLabel: {\n fontFamily: theme.typography.body1.fontFamily,\n fontSize: theme.typography.fontSize,\n fill: color.secondary()\n },\n axis: {\n stroke: color.primaryDark(),\n strokeWidth: 2\n },\n axisLine: {\n stroke: color.primaryDark(),\n strokeWidth: 2\n },\n tick: {\n '& > line': {\n stroke: color.primaryDark(),\n strokeWidth: 2\n },\n fill: color.primaryDark(),\n fontFamily: theme.typography.body1.fontFamily,\n fontSize: theme.typography.fontSize,\n textAnchor: 'middle'\n },\n dottedLine: {\n stroke: color.primaryLight(),\n opacity: 0.2\n }\n }),\n { withTheme: true }\n)(RawChartAxes);\n\nexport default ChartAxes;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"axes.js","names":["TickComponent","props","open","callback","setState","dialog","index","newLabel","categories","onChangeCategory","category","label","onChange","slice","value","title","text","onConfirm","handleAlertDialog","interactive","onClose","editable","state","classes","xBand","bandWidth","barWidth","rotate","top","graphProps","defineChart","x","y","formattedValue","parseInt","split","deletable","correctness","autoFocus","inDefineChart","barX","bandKey","longestCategory","reduce","a","b","lengthA","length","lengthB","longestLabel","pointerEvents","overflow","position","visibility","wordBreak","maxWidth","display","r","input","changeCategory","dottedLine","deleteCategory","e","changeInteractive","target","checked","changeEditable","React","Component","propTypes","PropTypes","array","func","number","object","string","RawChartAxes","height","document","getElementById","offsetHeight","leftAxis","theme","axis","axisLine","tick","axisLabel","scale","range","domain","size","bottomScale","rangeRound","width","bandwidth","max","rowTickValues","getTickValues","step","labelStep","fontSize","typography","getRotateAngle","getTickLabelProps","dy","dx","toLocaleString","getTickComponent","properties","min","textAnchor","count","isRequired","types","GraphPropsType","bool","ChartAxes","withStyles","fontFamily","body1","fill","color","secondary","stroke","primaryDark","strokeWidth","primaryLight","opacity","withTheme"],"sources":["../src/axes.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport { types } from '@pie-lib/plot';\nimport { color } from '@pie-lib/render-ui';\nimport { AlertDialog } from '@pie-lib/config-ui';\nimport { AxisLeft, AxisBottom } from '@vx/axis';\nimport { bandKey, getTickValues, getRotateAngle } from './utils';\nimport MarkLabel from './mark-label';\nimport Checkbox from '@material-ui/core/Checkbox';\n\nexport class TickComponent extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n dialog: {\n open: false\n }\n };\n }\n\n handleAlertDialog = (open, callback) =>\n this.setState(\n {\n dialog: { open }\n },\n callback\n );\n\n changeCategory = (index, newLabel) => {\n const { categories, onChangeCategory } = this.props;\n const category = categories[index];\n\n onChangeCategory(index, { ...category, label: newLabel });\n };\n\n deleteCategory = index => {\n const { categories, onChange } = this.props;\n\n if (index >= 0 && categories[index]) {\n onChange([...categories.slice(0, index), ...categories.slice(index + 1)]);\n }\n };\n\n changeInteractive = (index, value) => {\n const { categories, onChangeCategory } = this.props;\n const category = categories[index];\n\n if (!value) {\n this.setState({\n dialog: {\n open: true,\n title: 'Warning',\n text:\n 'This will remove the correct answer value that has been defined for this category.',\n onConfirm: () =>\n this.handleAlertDialog(\n false,\n onChangeCategory(index, { ...category, interactive: !category.interactive })\n ),\n onClose: () => this.handleAlertDialog(false)\n }\n });\n } else {\n onChangeCategory(index, { ...category, interactive: !category.interactive });\n }\n };\n\n changeEditable = (index, value) => {\n const { categories, onChangeCategory } = this.props;\n const category = categories[index];\n\n if (!value) {\n this.setState({\n dialog: {\n open: true,\n title: 'Warning',\n text:\n 'This will remove the correct answer category name that has been defined for this category.',\n onConfirm: () =>\n this.handleAlertDialog(\n false,\n onChangeCategory(index, { ...category, editable: !category.editable || false })\n ),\n onClose: () => this.handleAlertDialog(false)\n }\n });\n } else {\n onChangeCategory(index, { ...category, editable: !category.editable || false });\n }\n };\n\n render() {\n const {\n classes,\n categories,\n xBand,\n bandWidth,\n barWidth,\n rotate,\n top,\n graphProps,\n defineChart,\n x,\n y,\n formattedValue\n } = this.props;\n\n if (!formattedValue) {\n return null;\n }\n\n const { dialog } = this.state;\n const index = parseInt(formattedValue.split('-')[0], 10);\n const category = categories[index];\n const { deletable, editable, interactive, label, correctness, autoFocus, inDefineChart } =\n category || {};\n const barX = xBand(bandKey({ label }, index));\n const longestCategory = (categories || []).reduce((a, b) => {\n const lengthA = a && a.label ? a.label.length : 0;\n const lengthB = b && b.label ? b.label.length : 0;\n\n return lengthA > lengthB ? a : b;\n });\n\n const longestLabel = (longestCategory && longestCategory.label) || '';\n\n return (\n <g>\n <foreignObject\n x={bandWidth ? barX : x - barWidth / 2}\n y={6}\n width={barWidth}\n height={4}\n style={{ pointerEvents: 'none', overflow: 'visible' }}\n >\n {index === 0 && (\n <div\n id=\"hiddenLabel\"\n style={{\n position: 'absolute',\n visibility: 'hidden',\n wordBreak: 'break-word',\n overflow: 'visible',\n maxWidth: barWidth,\n display: 'block'\n }}\n >\n {longestLabel}\n </div>\n )}\n <MarkLabel\n autoFocus={inDefineChart ? defineChart && autoFocus : autoFocus}\n inputRef={r => (this.input = r)}\n disabled={!defineChart && !editable}\n mark={category}\n graphProps={graphProps}\n onChange={newLabel => this.changeCategory(index, newLabel)}\n barWidth={barWidth}\n rotate={rotate}\n correctness={correctness}\n />\n </foreignObject>\n {deletable && !correctness && (\n <line\n x1={x}\n y1={0}\n x2={x}\n y2={y + 4 + top}\n className={classes.dottedLine}\n strokeDasharray=\"4 2\"\n />\n )}\n {deletable && !correctness && (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n x={x - 8}\n y={y + 10 + top}\n width={16}\n height={16}\n viewBox=\"0 0 512 512\"\n onClick={() => this.deleteCategory(index)}\n >\n <path d=\"M128 405.429C128 428.846 147.198 448 170.667 448h170.667C364.802 448 384 428.846 384 405.429V160H128v245.429zM416 96h-80l-26.785-32H202.786L176 96H96v32h320V96z\" />\n </svg>\n )}\n {defineChart && index === 0 && (\n <text\n x={x - 80}\n y={y + 40 + top}\n width={barWidth}\n height={4}\n style={{\n position: 'absolute',\n pointerEvents: 'none',\n wordBreak: 'break-word',\n overflow: 'visible',\n maxWidth: barWidth,\n display: 'inline-block'\n }}\n >\n <tspan x=\"0\" dy=\".6em\">\n {' '}\n Student can{' '}\n </tspan>\n <tspan x=\"0\" dy=\"1.2em\">\n {' '}\n set value\n </tspan>\n </text>\n )}\n {defineChart && index === 0 && (\n <text\n x={x - 80}\n y={y + 80 + top}\n width={barWidth}\n height={4}\n style={{\n position: 'absolute',\n pointerEvents: 'none',\n wordBreak: 'break-word',\n overflow: 'visible',\n maxWidth: barWidth,\n display: 'inline-block'\n }}\n >\n <tspan x=\"0\" dy=\".6em\">\n {' '}\n Student can{' '}\n </tspan>\n <tspan x=\"0\" dy=\"1.2em\">\n {' '}\n edit name\n </tspan>\n </text>\n )}\n {defineChart && (\n <foreignObject\n x={x - 24}\n y={y + 20 + top}\n width={barWidth}\n height={4}\n style={{ pointerEvents: 'visible', overflow: 'visible' }}\n >\n <Checkbox\n checked={interactive}\n onChange={e => this.changeInteractive(index, e.target.checked)}\n />\n </foreignObject>\n )}\n {defineChart && (\n <foreignObject\n x={x - 24}\n y={y + 70 + top}\n width={barWidth}\n height={4}\n style={{ pointerEvents: 'visible', overflow: 'visible' }}\n >\n <Checkbox\n checked={editable}\n onChange={e => this.changeEditable(index, e.target.checked)}\n />\n </foreignObject>\n )}\n <foreignObject\n x={x - 24}\n y={y + 100 + top}\n width={barWidth}\n height={4}\n style={{ pointerEvents: 'visible', overflow: 'visible' }}\n >\n <AlertDialog\n open={dialog.open}\n title={dialog.title}\n text={dialog.text}\n onClose={dialog.onClose}\n onConfirm={dialog.onConfirm}\n />\n </foreignObject>\n </g>\n );\n }\n}\n\nTickComponent.propTypes = {\n categories: PropTypes.array,\n xBand: PropTypes.func,\n bandWidth: PropTypes.number,\n barWidth: PropTypes.number,\n rotate: PropTypes.number,\n top: PropTypes.number,\n x: PropTypes.number,\n y: PropTypes.number,\n graphProps: PropTypes.object,\n formattedValue: PropTypes.string,\n onChangeCategory: PropTypes.func,\n onChange: PropTypes.func,\n classes: PropTypes.object\n};\n\nexport class RawChartAxes extends React.Component {\n static propTypes = {\n bottomScale: PropTypes.func,\n classes: PropTypes.object.isRequired,\n categories: PropTypes.array,\n graphProps: types.GraphPropsType.isRequired,\n xBand: PropTypes.func,\n leftAxis: PropTypes.bool,\n onChange: PropTypes.func,\n onChangeCategory: PropTypes.func,\n top: PropTypes.number,\n theme: PropTypes.object\n };\n\n state = { height: 0 };\n\n componentDidMount() {\n const height = document.getElementById('hiddenLabel')\n ? document.getElementById('hiddenLabel').offsetHeight\n : 0;\n\n this.setState({ height });\n }\n\n render() {\n const {\n classes,\n graphProps,\n xBand,\n leftAxis,\n onChange,\n onChangeCategory,\n categories = [],\n top,\n defineChart,\n theme\n } = this.props;\n\n const { axis, axisLine, tick, axisLabel } = classes;\n const { scale = {}, range = {}, domain = {}, size = {} } = graphProps || {};\n const { height } = this.state;\n\n const bottomScale =\n xBand && typeof xBand.rangeRound === 'function' && xBand.rangeRound([0, size.width]);\n\n const bandWidth = xBand && typeof xBand.bandwidth === 'function' && xBand.bandwidth();\n // for chartType \"line\", bandWidth will be 0, so we have to calculate it\n const barWidth = bandWidth || (scale.x && scale.x(domain.max) / categories.length);\n\n const rowTickValues = getTickValues({ ...range, step: range.labelStep });\n const fontSize = theme && theme.typography ? theme.typography.fontSize : 14;\n const rotate = getRotateAngle(fontSize, height);\n\n const getTickLabelProps = value => ({\n dy: 4,\n dx: -10 - (value.toLocaleString().length || 1) * 5\n });\n\n const getTickComponent = props => {\n const properties = {\n classes,\n categories,\n xBand,\n bandWidth,\n barWidth,\n rotate,\n top,\n defineChart,\n onChangeCategory,\n onChange,\n graphProps,\n x: props.x,\n y: props.y,\n formattedValue: props.formattedValue\n };\n\n return <TickComponent {...properties} />;\n };\n\n return (\n <React.Fragment>\n {leftAxis && (\n <AxisLeft\n scale={scale.y}\n className={axis}\n axisLineClassName={axisLine}\n tickLength={10}\n tickClassName={tick}\n tickFormat={value => value}\n label={range.label}\n labelClassName={axisLabel}\n tickValues={rowTickValues}\n tickLabelProps={getTickLabelProps}\n />\n )}\n <AxisBottom\n axisLineClassName={axisLine}\n labelClassName={axisLabel}\n tickClassName={tick}\n scale={bottomScale}\n label={domain.label}\n labelProps={{ y: 60 + top }}\n top={scale.y && scale.y(range.min)}\n textLabelProps={() => ({ textAnchor: 'middle' })}\n tickFormat={count => count}\n tickComponent={getTickComponent}\n />\n </React.Fragment>\n );\n }\n}\n\nconst ChartAxes = withStyles(\n theme => ({\n axisLabel: {\n fontFamily: theme.typography.body1.fontFamily,\n fontSize: theme.typography.fontSize,\n fill: color.secondary()\n },\n axis: {\n stroke: color.primaryDark(),\n strokeWidth: 2\n },\n axisLine: {\n stroke: color.primaryDark(),\n strokeWidth: 2\n },\n tick: {\n '& > line': {\n stroke: color.primaryDark(),\n strokeWidth: 2\n },\n fill: color.primaryDark(),\n fontFamily: theme.typography.body1.fontFamily,\n fontSize: theme.typography.fontSize,\n textAnchor: 'middle'\n },\n dottedLine: {\n stroke: color.primaryLight(),\n opacity: 0.2\n }\n }),\n { withTheme: true }\n)(RawChartAxes);\n\nexport default ChartAxes;\n"],"mappings":"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"}
|
package/lib/chart-setup.js
CHANGED
|
@@ -33,12 +33,29 @@ var ConfigureChartPanel = function ConfigureChartPanel(props) {
|
|
|
33
33
|
var classes = props.classes,
|
|
34
34
|
model = props.model,
|
|
35
35
|
onChange = props.onChange,
|
|
36
|
+
chartDimensions = props.chartDimensions,
|
|
36
37
|
_props$gridValues = props.gridValues,
|
|
37
38
|
gridValues = _props$gridValues === void 0 ? {} : _props$gridValues,
|
|
38
39
|
_props$labelValues = props.labelValues,
|
|
39
40
|
labelValues = _props$labelValues === void 0 ? {} : _props$labelValues;
|
|
40
41
|
var range = model.range;
|
|
41
42
|
var size = model.graph;
|
|
43
|
+
|
|
44
|
+
var _ref = chartDimensions || {},
|
|
45
|
+
showInConfigPanel = _ref.showInConfigPanel,
|
|
46
|
+
width = _ref.width,
|
|
47
|
+
height = _ref.height;
|
|
48
|
+
|
|
49
|
+
var widthConstraints = {
|
|
50
|
+
min: width !== null && width !== void 0 && width.min ? Math.max(50, width.min) : 50,
|
|
51
|
+
max: width !== null && width !== void 0 && width.max ? Math.min(700, width.max) : 700,
|
|
52
|
+
step: (width === null || width === void 0 ? void 0 : width.step) >= 1 ? Math.min(200, width.step) : 20
|
|
53
|
+
};
|
|
54
|
+
var heightConstraints = {
|
|
55
|
+
min: height !== null && height !== void 0 && height.min ? Math.max(400, height.min) : 400,
|
|
56
|
+
max: height !== null && height !== void 0 && height.max ? Math.min(700, height.max) : 700,
|
|
57
|
+
step: (height === null || height === void 0 ? void 0 : height.step) >= 1 ? Math.min(200, height.step) : 20
|
|
58
|
+
};
|
|
42
59
|
var gridOptions = gridValues && gridValues.range ? {
|
|
43
60
|
customValues: gridValues.range
|
|
44
61
|
} : {
|
|
@@ -143,7 +160,7 @@ var ConfigureChartPanel = function ConfigureChartPanel(props) {
|
|
|
143
160
|
onChange: function onChange(e, v) {
|
|
144
161
|
return onRangeChanged('max', v);
|
|
145
162
|
}
|
|
146
|
-
})), !model.chartType.includes('Plot') && stepConfig, /*#__PURE__*/_react["default"].createElement("div", {
|
|
163
|
+
})), !model.chartType.includes('Plot') && stepConfig, showInConfigPanel && /*#__PURE__*/_react["default"].createElement("div", {
|
|
147
164
|
className: classes.dimensions
|
|
148
165
|
}, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Typography["default"], null, "Dimensions(px)")), /*#__PURE__*/_react["default"].createElement("div", {
|
|
149
166
|
className: classes.columnView
|
|
@@ -151,8 +168,9 @@ var ConfigureChartPanel = function ConfigureChartPanel(props) {
|
|
|
151
168
|
className: classes.textField,
|
|
152
169
|
label: 'Width',
|
|
153
170
|
value: size.width,
|
|
154
|
-
min:
|
|
155
|
-
max:
|
|
171
|
+
min: widthConstraints.min,
|
|
172
|
+
max: widthConstraints.max,
|
|
173
|
+
step: widthConstraints.step,
|
|
156
174
|
variant: 'outlined',
|
|
157
175
|
onChange: function onChange(e, v) {
|
|
158
176
|
return onSizeChanged('width', v);
|
|
@@ -165,8 +183,9 @@ var ConfigureChartPanel = function ConfigureChartPanel(props) {
|
|
|
165
183
|
className: classes.textField,
|
|
166
184
|
label: 'Height',
|
|
167
185
|
value: size.height,
|
|
168
|
-
min:
|
|
169
|
-
max:
|
|
186
|
+
min: heightConstraints.min,
|
|
187
|
+
max: heightConstraints.max,
|
|
188
|
+
step: heightConstraints.step,
|
|
170
189
|
variant: 'outlined',
|
|
171
190
|
onChange: function onChange(e, v) {
|
|
172
191
|
return onSizeChanged('height', v);
|
|
@@ -178,13 +197,10 @@ var ConfigureChartPanel = function ConfigureChartPanel(props) {
|
|
|
178
197
|
|
|
179
198
|
ConfigureChartPanel.propTypes = {
|
|
180
199
|
classes: _propTypes["default"].object,
|
|
181
|
-
sizeConstraints: _propTypes["default"].object,
|
|
182
200
|
domain: _propTypes["default"].object,
|
|
183
|
-
gridIntervalValues: _propTypes["default"].object,
|
|
184
|
-
includeAxes: _propTypes["default"].bool,
|
|
185
|
-
labelIntervalValues: _propTypes["default"].object,
|
|
186
201
|
onChange: _propTypes["default"]["function"],
|
|
187
202
|
range: _propTypes["default"].object,
|
|
203
|
+
chartDimension: _propTypes["default"].object,
|
|
188
204
|
size: _propTypes["default"].object
|
|
189
205
|
};
|
|
190
206
|
|
package/lib/chart-setup.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chart-setup.js","names":["ConfigureChartPanel","props","classes","model","onChange","gridValues","labelValues","range","size","graph","gridOptions","customValues","min","max","labelOptions","stepConfig","rowView","mediumTextField","step","e","v","onRangeChanged","labelStep","rangeProps","chartType","includes","onSizeChanged","key","value","onChartTypeChange","wrapper","content","target","dimensions","columnView","textField","width","disabled","height","propTypes","PropTypes","object","sizeConstraints","domain","gridIntervalValues","includeAxes","bool","labelIntervalValues","styles","theme","display","flexDirection","marginTop","alignItems","justifyContent","margin","spacing","unit","largeTextField","text","fontStyle","color","withStyles"],"sources":["../src/chart-setup.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { color } from '@pie-lib/render-ui';\nimport { withStyles } from '@material-ui/core/styles';\nimport Typography from '@material-ui/core/Typography';\nimport ChartType from './chart-type';\nimport { NumberTextFieldCustom } from '@pie-lib/config-ui';\n\nconst ConfigureChartPanel = props => {\n const { classes, model, onChange, gridValues = {}, labelValues = {} } = props;\n const { range } = model;\n const size = model.graph;\n\n const gridOptions =\n gridValues && gridValues.range ? { customValues: gridValues.range } : { min: 0, max: 10000 };\n const labelOptions =\n labelValues && labelValues.range ? { customValues: labelValues.range } : { min: 0, max: 10000 };\n\n const stepConfig = (\n <div className={classes.rowView}>\n <NumberTextFieldCustom\n className={classes.mediumTextField}\n label=\"Grid Interval\"\n value={range.step}\n variant=\"outlined\"\n onChange={(e, v) => onRangeChanged('step', v)}\n {...gridOptions}\n />\n <NumberTextFieldCustom\n className={classes.mediumTextField}\n label={'Label Interval'}\n value={range.labelStep}\n variant={'outlined'}\n onChange={(e, v) => onRangeChanged('labelStep', v)}\n {...labelOptions}\n />\n </div>\n );\n\n const rangeProps = chartType => {\n return chartType.includes('Plot') ? { min: 3, max: 10 } : { min: 0.05, max: 10000 };\n };\n\n const onSizeChanged = (key, value) => {\n const graph = { ...size, [key]: value };\n\n onChange({ ...model, graph });\n };\n\n const onRangeChanged = (key, value) => {\n range[key] = value;\n\n onChange({ ...model, range });\n };\n\n const onChartTypeChange = chartType => {\n if (chartType.includes('Plot')) {\n rangeProps.min = 3;\n rangeProps.max = 10;\n\n if (range.max > 10 || range.max < 3) {\n range.max = 10;\n }\n\n range.step = 1;\n range.labelStep = 1;\n\n onChange({ ...model, range, chartType });\n\n return;\n }\n\n onChange({ ...model, chartType });\n };\n\n return (\n <div className={classes.wrapper}>\n <Typography variant={'subtitle1'}>Configure Chart</Typography>\n <div className={classes.content}>\n <div className={classes.rowView}>\n <ChartType value={model.chartType} onChange={e => onChartTypeChange(e.target.value)} />\n <NumberTextFieldCustom\n className={classes.mediumTextField}\n label=\"Max Value\"\n value={range.max}\n min={rangeProps(model.chartType).min}\n max={rangeProps(model.chartType).max}\n variant=\"outlined\"\n onChange={(e, v) => onRangeChanged('max', v)}\n />\n </div>\n {!model.chartType.includes('Plot') && stepConfig}\n <div className={classes.dimensions}>\n <div>\n <Typography>Dimensions(px)</Typography>\n </div>\n <div className={classes.columnView}>\n <NumberTextFieldCustom\n className={classes.textField}\n label={'Width'}\n value={size.width}\n min={50}\n max={700}\n variant={'outlined'}\n onChange={(e, v) => onSizeChanged('width', v)}\n />\n <Typography className={classes.disabled}>Min 50, Max 700</Typography>\n </div>\n <div className={classes.columnView}>\n <NumberTextFieldCustom\n className={classes.textField}\n label={'Height'}\n value={size.height}\n min={400}\n max={700}\n variant={'outlined'}\n onChange={(e, v) => onSizeChanged('height', v)}\n />\n <Typography className={classes.disabled}>Min 400, Max 700</Typography>\n </div>\n </div>\n </div>\n </div>\n );\n};\n\nConfigureChartPanel.propTypes = {\n classes: PropTypes.object,\n sizeConstraints: PropTypes.object,\n domain: PropTypes.object,\n gridIntervalValues: PropTypes.object,\n includeAxes: PropTypes.bool,\n labelIntervalValues: PropTypes.object,\n onChange: PropTypes.function,\n range: PropTypes.object,\n size: PropTypes.object\n};\n\nconst styles = theme => ({\n wrapper: {\n width: '450px'\n },\n content: {\n display: 'flex',\n flexDirection: 'column',\n width: '100%',\n marginTop: '24px'\n },\n columnView: {\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'center'\n },\n rowView: {\n display: 'flex',\n justifyContent: 'space-around',\n alignItems: 'center'\n },\n textField: {\n width: '130px',\n margin: `${theme.spacing.unit}px ${theme.spacing.unit / 2}px`\n },\n mediumTextField: {\n width: '160px',\n margin: `${theme.spacing.unit}px ${theme.spacing.unit / 2}px`\n },\n largeTextField: {\n width: '230px',\n margin: `${theme.spacing.unit}px ${theme.spacing.unit / 2}px`\n },\n text: {\n fontStyle: 'italic',\n margin: `${theme.spacing.unit}px 0`\n },\n dimensions: {\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n margin: '24px 0px'\n },\n disabled: {\n color: color.disabled()\n }\n});\n\nexport default withStyles(styles)(ConfigureChartPanel);\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"chart-setup.js","names":["ConfigureChartPanel","props","classes","model","onChange","chartDimensions","gridValues","labelValues","range","size","graph","showInConfigPanel","width","height","widthConstraints","min","Math","max","step","heightConstraints","gridOptions","customValues","labelOptions","stepConfig","rowView","mediumTextField","e","v","onRangeChanged","labelStep","rangeProps","chartType","includes","onSizeChanged","key","value","onChartTypeChange","wrapper","content","target","dimensions","columnView","textField","disabled","propTypes","PropTypes","object","domain","chartDimension","styles","theme","display","flexDirection","marginTop","alignItems","justifyContent","margin","spacing","unit","largeTextField","text","fontStyle","color","withStyles"],"sources":["../src/chart-setup.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { color } from '@pie-lib/render-ui';\nimport { withStyles } from '@material-ui/core/styles';\nimport Typography from '@material-ui/core/Typography';\nimport ChartType from './chart-type';\nimport { NumberTextFieldCustom } from '@pie-lib/config-ui';\n\nconst ConfigureChartPanel = props => {\n const { classes, model, onChange, chartDimensions, gridValues = {}, labelValues = {} } = props;\n const { range } = model;\n const size = model.graph;\n const { showInConfigPanel, width, height } = chartDimensions || {};\n\n const widthConstraints = {\n min: width?.min ? Math.max(50, width.min) : 50,\n max: width?.max ? Math.min(700, width.max) : 700,\n step: width?.step >= 1 ? Math.min(200, width.step) : 20\n };\n const heightConstraints = {\n min: height?.min ? Math.max(400, height.min) : 400,\n max: height?.max ? Math.min(700, height.max) : 700,\n step: height?.step >= 1 ? Math.min(200, height.step) : 20\n };\n\n const gridOptions =\n gridValues && gridValues.range ? { customValues: gridValues.range } : { min: 0, max: 10000 };\n const labelOptions =\n labelValues && labelValues.range ? { customValues: labelValues.range } : { min: 0, max: 10000 };\n\n const stepConfig = (\n <div className={classes.rowView}>\n <NumberTextFieldCustom\n className={classes.mediumTextField}\n label=\"Grid Interval\"\n value={range.step}\n variant=\"outlined\"\n onChange={(e, v) => onRangeChanged('step', v)}\n {...gridOptions}\n />\n <NumberTextFieldCustom\n className={classes.mediumTextField}\n label={'Label Interval'}\n value={range.labelStep}\n variant={'outlined'}\n onChange={(e, v) => onRangeChanged('labelStep', v)}\n {...labelOptions}\n />\n </div>\n );\n\n const rangeProps = chartType => {\n return chartType.includes('Plot') ? { min: 3, max: 10 } : { min: 0.05, max: 10000 };\n };\n\n const onSizeChanged = (key, value) => {\n const graph = { ...size, [key]: value };\n\n onChange({ ...model, graph });\n };\n\n const onRangeChanged = (key, value) => {\n range[key] = value;\n\n onChange({ ...model, range });\n };\n\n const onChartTypeChange = chartType => {\n if (chartType.includes('Plot')) {\n rangeProps.min = 3;\n rangeProps.max = 10;\n\n if (range.max > 10 || range.max < 3) {\n range.max = 10;\n }\n\n range.step = 1;\n range.labelStep = 1;\n\n onChange({ ...model, range, chartType });\n\n return;\n }\n\n onChange({ ...model, chartType });\n };\n\n return (\n <div className={classes.wrapper}>\n <Typography variant={'subtitle1'}>Configure Chart</Typography>\n <div className={classes.content}>\n <div className={classes.rowView}>\n <ChartType value={model.chartType} onChange={e => onChartTypeChange(e.target.value)} />\n <NumberTextFieldCustom\n className={classes.mediumTextField}\n label=\"Max Value\"\n value={range.max}\n min={rangeProps(model.chartType).min}\n max={rangeProps(model.chartType).max}\n variant=\"outlined\"\n onChange={(e, v) => onRangeChanged('max', v)}\n />\n </div>\n {!model.chartType.includes('Plot') && stepConfig}\n {showInConfigPanel && (\n <div className={classes.dimensions}>\n <div>\n <Typography>Dimensions(px)</Typography>\n </div>\n <div className={classes.columnView}>\n <NumberTextFieldCustom\n className={classes.textField}\n label={'Width'}\n value={size.width}\n min={widthConstraints.min}\n max={widthConstraints.max}\n step={widthConstraints.step}\n variant={'outlined'}\n onChange={(e, v) => onSizeChanged('width', v)}\n />\n <Typography className={classes.disabled}>Min 50, Max 700</Typography>\n </div>\n <div className={classes.columnView}>\n <NumberTextFieldCustom\n className={classes.textField}\n label={'Height'}\n value={size.height}\n min={heightConstraints.min}\n max={heightConstraints.max}\n step={heightConstraints.step}\n variant={'outlined'}\n onChange={(e, v) => onSizeChanged('height', v)}\n />\n <Typography className={classes.disabled}>Min 400, Max 700</Typography>\n </div>\n </div>\n )}\n </div>\n </div>\n );\n};\n\nConfigureChartPanel.propTypes = {\n classes: PropTypes.object,\n domain: PropTypes.object,\n onChange: PropTypes.function,\n range: PropTypes.object,\n chartDimension: PropTypes.object,\n size: PropTypes.object\n};\n\nconst styles = theme => ({\n wrapper: {\n width: '450px'\n },\n content: {\n display: 'flex',\n flexDirection: 'column',\n width: '100%',\n marginTop: '24px'\n },\n columnView: {\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'center'\n },\n rowView: {\n display: 'flex',\n justifyContent: 'space-around',\n alignItems: 'center'\n },\n textField: {\n width: '130px',\n margin: `${theme.spacing.unit}px ${theme.spacing.unit / 2}px`\n },\n mediumTextField: {\n width: '160px',\n margin: `${theme.spacing.unit}px ${theme.spacing.unit / 2}px`\n },\n largeTextField: {\n width: '230px',\n margin: `${theme.spacing.unit}px ${theme.spacing.unit / 2}px`\n },\n text: {\n fontStyle: 'italic',\n margin: `${theme.spacing.unit}px 0`\n },\n dimensions: {\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n margin: '24px 0px'\n },\n disabled: {\n color: color.disabled()\n }\n});\n\nexport default withStyles(styles)(ConfigureChartPanel);\n"],"mappings":"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"}
|
package/lib/mark-label.js
CHANGED
|
@@ -9,10 +9,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
9
9
|
});
|
|
10
10
|
exports["default"] = 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"));
|
|
@@ -47,8 +47,9 @@ var styles = function styles(theme) {
|
|
|
47
47
|
color: _renderUi.color.primaryDark(),
|
|
48
48
|
'&.correct': (0, _styles2.correct)('color'),
|
|
49
49
|
'&.incorrect': (0, _styles2.incorrect)('color'),
|
|
50
|
-
'&.disabled': (0, _styles2.disabled)('color'),
|
|
51
|
-
|
|
50
|
+
'&.disabled': _objectSpread(_objectSpread({}, (0, _styles2.disabled)('color')), {}, {
|
|
51
|
+
backgroundColor: 'transparent !important'
|
|
52
|
+
})
|
|
52
53
|
}
|
|
53
54
|
};
|
|
54
55
|
};
|
package/lib/mark-label.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mark-label.js","names":["styles","theme","input","fontFamily","typography","fontSize","border","color","primaryDark","correct","incorrect","disabled","backgroundColor","MarkLabel","props","useState","setInput","_ref","useCallback","node","mark","classes","externalInputRef","inputRef","barWidth","rotate","correctness","autoFocus","label","setLabel","onChange","e","target","value","onChangeProp","extraStyle","width","textAlign","useEffect","r","cn","minWidth","background","boxSizing","paddingLeft","paddingRight","position","pointerEvents","top","left","transformOrigin","transform","propTypes","PropTypes","bool","func","graphProps","types","GraphPropsType","object","number","shape","string","withStyles"],"sources":["../src/mark-label.jsx"],"sourcesContent":["import React, { useState, useCallback, useEffect } from 'react';\nimport cn from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport AutosizeInput from 'react-input-autosize';\nimport PropTypes from 'prop-types';\nimport { types } from '@pie-lib/plot';\nimport { correct, incorrect, disabled } from './common/styles';\nimport { color } from '@pie-lib/render-ui';\n\nconst styles = theme => ({\n input: {\n float: 'right',\n fontFamily: theme.typography.fontFamily,\n fontSize: theme.typography.fontSize,\n border: 'none',\n color: color.primaryDark(),\n '&.correct': correct('color'),\n '&.incorrect': incorrect('color'),\n '&.disabled': disabled('color')
|
|
1
|
+
{"version":3,"file":"mark-label.js","names":["styles","theme","input","fontFamily","typography","fontSize","border","color","primaryDark","correct","incorrect","disabled","backgroundColor","MarkLabel","props","useState","setInput","_ref","useCallback","node","mark","classes","externalInputRef","inputRef","barWidth","rotate","correctness","autoFocus","label","setLabel","onChange","e","target","value","onChangeProp","extraStyle","width","textAlign","useEffect","r","cn","minWidth","background","boxSizing","paddingLeft","paddingRight","position","pointerEvents","top","left","transformOrigin","transform","propTypes","PropTypes","bool","func","graphProps","types","GraphPropsType","object","number","shape","string","withStyles"],"sources":["../src/mark-label.jsx"],"sourcesContent":["import React, { useState, useCallback, useEffect } from 'react';\nimport cn from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport AutosizeInput from 'react-input-autosize';\nimport PropTypes from 'prop-types';\nimport { types } from '@pie-lib/plot';\nimport { correct, incorrect, disabled } from './common/styles';\nimport { color } from '@pie-lib/render-ui';\n\nconst styles = theme => ({\n input: {\n float: 'right',\n fontFamily: theme.typography.fontFamily,\n fontSize: theme.typography.fontSize,\n border: 'none',\n color: color.primaryDark(),\n '&.correct': correct('color'),\n '&.incorrect': incorrect('color'),\n '&.disabled': { ...disabled('color'), backgroundColor: 'transparent !important' }\n }\n});\n\nexport const MarkLabel = props => {\n // eslint-disable-next-line no-unused-vars\n const [input, setInput] = useState(null);\n const _ref = useCallback(node => setInput(node), null);\n\n const {\n mark,\n classes,\n disabled,\n inputRef: externalInputRef,\n barWidth,\n rotate,\n correctness,\n autoFocus\n } = props;\n const [label, setLabel] = useState(mark.label);\n const onChange = e => setLabel(e.target.value);\n const onChangeProp = e => props.onChange(e.target.value);\n let extraStyle = {};\n\n if (rotate) {\n extraStyle = {\n width: 'unset',\n textAlign: 'left'\n };\n }\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 return (\n <AutosizeInput\n autoFocus={autoFocus}\n inputRef={r => {\n _ref(r);\n externalInputRef(r);\n }}\n disabled={disabled}\n inputClassName={cn(classes.input, correctness && correctness.label, disabled && 'disabled')}\n inputStyle={{\n minWidth: barWidth,\n textAlign: 'center',\n background: 'transparent',\n boxSizing: 'border-box',\n paddingLeft: 0,\n paddingRight: 0,\n ...extraStyle\n }}\n value={label}\n style={{\n position: 'absolute',\n pointerEvents: 'auto',\n top: 0,\n left: 0,\n minWidth: barWidth,\n transformOrigin: 'left',\n transform: `rotate(${rotate}deg)`\n }}\n onChange={onChange}\n onBlur={onChangeProp}\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 barWidth: PropTypes.number,\n rotate: PropTypes.number,\n correctness: PropTypes.shape({\n value: PropTypes.string,\n label: PropTypes.string\n })\n};\n\nexport default withStyles(styles)(MarkLabel);\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"publishConfig": {
|
|
4
4
|
"access": "public"
|
|
5
5
|
},
|
|
6
|
-
"version": "4.5.11-next.
|
|
6
|
+
"version": "4.5.11-next.578+49021617",
|
|
7
7
|
"description": "charting",
|
|
8
8
|
"keywords": [
|
|
9
9
|
"react",
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
"dependencies": {
|
|
20
20
|
"@mapbox/point-geometry": "^0.1.0",
|
|
21
21
|
"@material-ui/core": "^3.8.3",
|
|
22
|
-
"@pie-lib/plot": "^2.
|
|
22
|
+
"@pie-lib/plot": "^2.2.0",
|
|
23
23
|
"@vx/axis": "^0.0.183",
|
|
24
24
|
"@vx/event": "^0.0.182",
|
|
25
25
|
"@vx/grid": "^0.0.183",
|
|
@@ -43,5 +43,5 @@
|
|
|
43
43
|
"peerDependencies": {
|
|
44
44
|
"react": "^16.8.1"
|
|
45
45
|
},
|
|
46
|
-
"gitHead": "
|
|
46
|
+
"gitHead": "49021617b65055c9046abaaf68904f3158650782"
|
|
47
47
|
}
|
package/src/axes.jsx
CHANGED
|
@@ -3,12 +3,30 @@ import PropTypes from 'prop-types';
|
|
|
3
3
|
import { withStyles } from '@material-ui/core/styles';
|
|
4
4
|
import { types } from '@pie-lib/plot';
|
|
5
5
|
import { color } from '@pie-lib/render-ui';
|
|
6
|
+
import { AlertDialog } from '@pie-lib/config-ui';
|
|
6
7
|
import { AxisLeft, AxisBottom } from '@vx/axis';
|
|
7
8
|
import { bandKey, getTickValues, getRotateAngle } from './utils';
|
|
8
9
|
import MarkLabel from './mark-label';
|
|
9
10
|
import Checkbox from '@material-ui/core/Checkbox';
|
|
10
11
|
|
|
11
12
|
export class TickComponent extends React.Component {
|
|
13
|
+
constructor(props) {
|
|
14
|
+
super(props);
|
|
15
|
+
this.state = {
|
|
16
|
+
dialog: {
|
|
17
|
+
open: false
|
|
18
|
+
}
|
|
19
|
+
};
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
handleAlertDialog = (open, callback) =>
|
|
23
|
+
this.setState(
|
|
24
|
+
{
|
|
25
|
+
dialog: { open }
|
|
26
|
+
},
|
|
27
|
+
callback
|
|
28
|
+
);
|
|
29
|
+
|
|
12
30
|
changeCategory = (index, newLabel) => {
|
|
13
31
|
const { categories, onChangeCategory } = this.props;
|
|
14
32
|
const category = categories[index];
|
|
@@ -28,14 +46,48 @@ export class TickComponent extends React.Component {
|
|
|
28
46
|
const { categories, onChangeCategory } = this.props;
|
|
29
47
|
const category = categories[index];
|
|
30
48
|
|
|
31
|
-
|
|
49
|
+
if (!value) {
|
|
50
|
+
this.setState({
|
|
51
|
+
dialog: {
|
|
52
|
+
open: true,
|
|
53
|
+
title: 'Warning',
|
|
54
|
+
text:
|
|
55
|
+
'This will remove the correct answer value that has been defined for this category.',
|
|
56
|
+
onConfirm: () =>
|
|
57
|
+
this.handleAlertDialog(
|
|
58
|
+
false,
|
|
59
|
+
onChangeCategory(index, { ...category, interactive: !category.interactive })
|
|
60
|
+
),
|
|
61
|
+
onClose: () => this.handleAlertDialog(false)
|
|
62
|
+
}
|
|
63
|
+
});
|
|
64
|
+
} else {
|
|
65
|
+
onChangeCategory(index, { ...category, interactive: !category.interactive });
|
|
66
|
+
}
|
|
32
67
|
};
|
|
33
68
|
|
|
34
69
|
changeEditable = (index, value) => {
|
|
35
70
|
const { categories, onChangeCategory } = this.props;
|
|
36
71
|
const category = categories[index];
|
|
37
72
|
|
|
38
|
-
|
|
73
|
+
if (!value) {
|
|
74
|
+
this.setState({
|
|
75
|
+
dialog: {
|
|
76
|
+
open: true,
|
|
77
|
+
title: 'Warning',
|
|
78
|
+
text:
|
|
79
|
+
'This will remove the correct answer category name that has been defined for this category.',
|
|
80
|
+
onConfirm: () =>
|
|
81
|
+
this.handleAlertDialog(
|
|
82
|
+
false,
|
|
83
|
+
onChangeCategory(index, { ...category, editable: !category.editable || false })
|
|
84
|
+
),
|
|
85
|
+
onClose: () => this.handleAlertDialog(false)
|
|
86
|
+
}
|
|
87
|
+
});
|
|
88
|
+
} else {
|
|
89
|
+
onChangeCategory(index, { ...category, editable: !category.editable || false });
|
|
90
|
+
}
|
|
39
91
|
};
|
|
40
92
|
|
|
41
93
|
render() {
|
|
@@ -58,6 +110,7 @@ export class TickComponent extends React.Component {
|
|
|
58
110
|
return null;
|
|
59
111
|
}
|
|
60
112
|
|
|
113
|
+
const { dialog } = this.state;
|
|
61
114
|
const index = parseInt(formattedValue.split('-')[0], 10);
|
|
62
115
|
const category = categories[index];
|
|
63
116
|
const { deletable, editable, interactive, label, correctness, autoFocus, inDefineChart } =
|
|
@@ -209,6 +262,21 @@ export class TickComponent extends React.Component {
|
|
|
209
262
|
/>
|
|
210
263
|
</foreignObject>
|
|
211
264
|
)}
|
|
265
|
+
<foreignObject
|
|
266
|
+
x={x - 24}
|
|
267
|
+
y={y + 100 + top}
|
|
268
|
+
width={barWidth}
|
|
269
|
+
height={4}
|
|
270
|
+
style={{ pointerEvents: 'visible', overflow: 'visible' }}
|
|
271
|
+
>
|
|
272
|
+
<AlertDialog
|
|
273
|
+
open={dialog.open}
|
|
274
|
+
title={dialog.title}
|
|
275
|
+
text={dialog.text}
|
|
276
|
+
onClose={dialog.onClose}
|
|
277
|
+
onConfirm={dialog.onConfirm}
|
|
278
|
+
/>
|
|
279
|
+
</foreignObject>
|
|
212
280
|
</g>
|
|
213
281
|
);
|
|
214
282
|
}
|
package/src/chart-setup.jsx
CHANGED
|
@@ -7,9 +7,21 @@ import ChartType from './chart-type';
|
|
|
7
7
|
import { NumberTextFieldCustom } from '@pie-lib/config-ui';
|
|
8
8
|
|
|
9
9
|
const ConfigureChartPanel = props => {
|
|
10
|
-
const { classes, model, onChange, gridValues = {}, labelValues = {} } = props;
|
|
10
|
+
const { classes, model, onChange, chartDimensions, gridValues = {}, labelValues = {} } = props;
|
|
11
11
|
const { range } = model;
|
|
12
12
|
const size = model.graph;
|
|
13
|
+
const { showInConfigPanel, width, height } = chartDimensions || {};
|
|
14
|
+
|
|
15
|
+
const widthConstraints = {
|
|
16
|
+
min: width?.min ? Math.max(50, width.min) : 50,
|
|
17
|
+
max: width?.max ? Math.min(700, width.max) : 700,
|
|
18
|
+
step: width?.step >= 1 ? Math.min(200, width.step) : 20
|
|
19
|
+
};
|
|
20
|
+
const heightConstraints = {
|
|
21
|
+
min: height?.min ? Math.max(400, height.min) : 400,
|
|
22
|
+
max: height?.max ? Math.min(700, height.max) : 700,
|
|
23
|
+
step: height?.step >= 1 ? Math.min(200, height.step) : 20
|
|
24
|
+
};
|
|
13
25
|
|
|
14
26
|
const gridOptions =
|
|
15
27
|
gridValues && gridValues.range ? { customValues: gridValues.range } : { min: 0, max: 10000 };
|
|
@@ -90,35 +102,39 @@ const ConfigureChartPanel = props => {
|
|
|
90
102
|
/>
|
|
91
103
|
</div>
|
|
92
104
|
{!model.chartType.includes('Plot') && stepConfig}
|
|
93
|
-
|
|
94
|
-
<div>
|
|
95
|
-
<
|
|
105
|
+
{showInConfigPanel && (
|
|
106
|
+
<div className={classes.dimensions}>
|
|
107
|
+
<div>
|
|
108
|
+
<Typography>Dimensions(px)</Typography>
|
|
109
|
+
</div>
|
|
110
|
+
<div className={classes.columnView}>
|
|
111
|
+
<NumberTextFieldCustom
|
|
112
|
+
className={classes.textField}
|
|
113
|
+
label={'Width'}
|
|
114
|
+
value={size.width}
|
|
115
|
+
min={widthConstraints.min}
|
|
116
|
+
max={widthConstraints.max}
|
|
117
|
+
step={widthConstraints.step}
|
|
118
|
+
variant={'outlined'}
|
|
119
|
+
onChange={(e, v) => onSizeChanged('width', v)}
|
|
120
|
+
/>
|
|
121
|
+
<Typography className={classes.disabled}>Min 50, Max 700</Typography>
|
|
122
|
+
</div>
|
|
123
|
+
<div className={classes.columnView}>
|
|
124
|
+
<NumberTextFieldCustom
|
|
125
|
+
className={classes.textField}
|
|
126
|
+
label={'Height'}
|
|
127
|
+
value={size.height}
|
|
128
|
+
min={heightConstraints.min}
|
|
129
|
+
max={heightConstraints.max}
|
|
130
|
+
step={heightConstraints.step}
|
|
131
|
+
variant={'outlined'}
|
|
132
|
+
onChange={(e, v) => onSizeChanged('height', v)}
|
|
133
|
+
/>
|
|
134
|
+
<Typography className={classes.disabled}>Min 400, Max 700</Typography>
|
|
135
|
+
</div>
|
|
96
136
|
</div>
|
|
97
|
-
|
|
98
|
-
<NumberTextFieldCustom
|
|
99
|
-
className={classes.textField}
|
|
100
|
-
label={'Width'}
|
|
101
|
-
value={size.width}
|
|
102
|
-
min={50}
|
|
103
|
-
max={700}
|
|
104
|
-
variant={'outlined'}
|
|
105
|
-
onChange={(e, v) => onSizeChanged('width', v)}
|
|
106
|
-
/>
|
|
107
|
-
<Typography className={classes.disabled}>Min 50, Max 700</Typography>
|
|
108
|
-
</div>
|
|
109
|
-
<div className={classes.columnView}>
|
|
110
|
-
<NumberTextFieldCustom
|
|
111
|
-
className={classes.textField}
|
|
112
|
-
label={'Height'}
|
|
113
|
-
value={size.height}
|
|
114
|
-
min={400}
|
|
115
|
-
max={700}
|
|
116
|
-
variant={'outlined'}
|
|
117
|
-
onChange={(e, v) => onSizeChanged('height', v)}
|
|
118
|
-
/>
|
|
119
|
-
<Typography className={classes.disabled}>Min 400, Max 700</Typography>
|
|
120
|
-
</div>
|
|
121
|
-
</div>
|
|
137
|
+
)}
|
|
122
138
|
</div>
|
|
123
139
|
</div>
|
|
124
140
|
);
|
|
@@ -126,13 +142,10 @@ const ConfigureChartPanel = props => {
|
|
|
126
142
|
|
|
127
143
|
ConfigureChartPanel.propTypes = {
|
|
128
144
|
classes: PropTypes.object,
|
|
129
|
-
sizeConstraints: PropTypes.object,
|
|
130
145
|
domain: PropTypes.object,
|
|
131
|
-
gridIntervalValues: PropTypes.object,
|
|
132
|
-
includeAxes: PropTypes.bool,
|
|
133
|
-
labelIntervalValues: PropTypes.object,
|
|
134
146
|
onChange: PropTypes.function,
|
|
135
147
|
range: PropTypes.object,
|
|
148
|
+
chartDimension: PropTypes.object,
|
|
136
149
|
size: PropTypes.object
|
|
137
150
|
};
|
|
138
151
|
|
package/src/mark-label.jsx
CHANGED
|
@@ -16,8 +16,7 @@ const styles = theme => ({
|
|
|
16
16
|
color: color.primaryDark(),
|
|
17
17
|
'&.correct': correct('color'),
|
|
18
18
|
'&.incorrect': incorrect('color'),
|
|
19
|
-
'&.disabled': disabled('color'),
|
|
20
|
-
backgroundColor: 'transparent !important'
|
|
19
|
+
'&.disabled': { ...disabled('color'), backgroundColor: 'transparent !important' }
|
|
21
20
|
}
|
|
22
21
|
});
|
|
23
22
|
|