@pie-lib/charting 7.0.4-next.32 → 7.0.4-next.33

package/dist/_virtual/_rolldown/runtime.js

@@ -15,9 +15,6 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 }, l = (e, t, n) => (c(e, t, "default"), n && c(n, t, "default")), u = (n, r, a) => (a = n == null ? {} : e(i(n)), c(r || !n || !n.__esModule ? t(a, "default", {
 	value: n,
 	enumerable: !0
-}) : a, n)), d = /* @__PURE__ */ ((e) => typeof require < "u" ? require : typeof Proxy < "u" ? new Proxy(e, { get: (e, t) => (typeof require < "u" ? require : e)[t] }) : e)(function(e) {
-	if (typeof require < "u") return require.apply(this, arguments);
-	throw Error("Calling `require` for \"" + e + "\" in an environment that doesn't expose the `require` function. See https://rolldown.rs/in-depth/bundling-cjs#require-external-modules for more details.");
-});
+}) : a, n));
 //#endregion
-export { o as __commonJSMin, s as __exportAll, l as __reExport, d as __require, u as __toESM };
+export { o as __commonJSMin, s as __exportAll, l as __reExport, u as __toESM };

package/dist/actions-button.js

@@ -1,8 +1,8 @@
 import e from "react";
 import t from "prop-types";
 import { styled as n } from "@mui/material/styles";
-import { color as r } from "@pie-lib/render-ui";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { color as a } from "@pie-lib/render-ui";
 import o from "@mui/material/Button";
 import s from "@mui/material/Popover";
 import c from "@mui/material/Paper";
@@ -11,7 +11,7 @@ import l from "@pie-lib/translator";
 var { translator: u } = l, d = n("div")(() => ({ alignSelf: "flex-end" })), f = n("div")(({ theme: e }) => ({
 	cursor: "pointer",
 	fontSize: e.typography.fontSize,
-	color: r.tertiary(),
+	color: a.tertiary(),
 	padding: e.spacing(1)
 })), p = n(c)(({ theme: e }) => ({
 	padding: e.spacing(1),
@@ -21,7 +21,7 @@ var { translator: u } = l, d = n("div")(() => ({ alignSelf: "flex-end" })), f =
 	"& button": {
 		textTransform: "none",
 		fontSize: e.typography.fontSize,
-		color: r.text(),
+		color: a.text(),
 		justifyContent: "flex-start"
 	}
 })), m = class extends e.Component {
@@ -53,12 +53,12 @@ var { translator: u } = l, d = n("div")(() => ({ alignSelf: "flex-end" })), f =
 	};
 	render() {
 		let { categories: e, language: t } = this.props, { actionsAnchorEl: n } = this.state;
-		return /* @__PURE__ */ a(d, { children: [/* @__PURE__ */ i(f, {
+		return /* @__PURE__ */ i(d, { children: [/* @__PURE__ */ r(f, {
 			role: "button",
 			tabIndex: 0,
 			onClick: this.handleActionsClick,
 			children: "Actions"
-		}), /* @__PURE__ */ i(s, {
+		}), /* @__PURE__ */ r(s, {
 			open: !!n,
 			anchorEl: n,
 			onClose: this.handleActionsClose,
@@ -70,10 +70,10 @@ var { translator: u } = l, d = n("div")(() => ({ alignSelf: "flex-end" })), f =
 				vertical: "top",
 				horizontal: "left"
 			},
-			children: /* @__PURE__ */ a(p, { children: [/* @__PURE__ */ a(o, {
+			children: /* @__PURE__ */ i(p, { children: [/* @__PURE__ */ i(o, {
 				onClick: () => this.handleAddCategory(),
 				children: ["+ ", u.t("charting.add", { lng: t })]
-			}), e.length > 0 && e.map((e, n) => e.deletable && !e.correctness && /* @__PURE__ */ i(o, {
+			}), e.length > 0 && e.map((e, n) => e.deletable && !e.correctness && /* @__PURE__ */ r(o, {
 				onClick: () => this.handleDeleteCategory(n),
 				children: `${u.t("charting.delete", { lng: t })} <${e.label || u.t("charting.newLabel", { lng: t })}>`
 			}, n))] })

package/dist/axes.js

@@ -1,5 +1,5 @@
-import e from "./node_modules/.bun/@visx_axis@3.12.0_f4eacebf2041cd4f/node_modules/@visx/axis/esm/axis/AxisLeft.js";
-import t from "./node_modules/.bun/@visx_axis@3.12.0_f4eacebf2041cd4f/node_modules/@visx/axis/esm/axis/AxisBottom.js";
+import e from "./node_modules/.bun/@visx_axis@4.0.0_d84c32d47042070f/node_modules/@visx/axis/esm/axis/AxisLeft.js";
+import t from "./node_modules/.bun/@visx_axis@4.0.0_d84c32d47042070f/node_modules/@visx/axis/esm/axis/AxisBottom.js";
 import { TickCorrectnessIndicator as n } from "./common/correctness-indicators.js";
 import { bandKey as r, getRotateAngle as i, getTickValues as a } from "./utils.js";
 import { MarkLabel as o } from "./mark-label.js";
@@ -8,8 +8,8 @@ import c from "prop-types";
 import { styled as l } from "@mui/material/styles";
 import { types as u } from "@pie-lib/plot";
 import { AlertDialog as d } from "@pie-lib/config-ui";
-import { color as f } from "@pie-lib/render-ui";
-import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { color as m } from "@pie-lib/render-ui";
 import h from "@mui/material/Checkbox";
 import { renderMath as g } from "@pie-element/shared-math-rendering-mathjax";
 //#region src/axes.tsx
@@ -28,15 +28,15 @@ function b(e) {
 var x = l("text")(({ theme: e }) => ({
 	fontSize: e.typography.fontSize - 2,
 	fill: e.palette.error.main
-})), S = l(h)(() => ({ color: `${f.tertiary()} !important` })), C = l("g")(({ theme: e }) => ({
+})), S = l(h)(() => ({ color: `${m.tertiary()} !important` })), C = l("g")(({ theme: e }) => ({
 	"& .vx-axis-line": {
-		stroke: f.visualElementsColors.AXIS_LINE_COLOR,
+		stroke: m.visualElementsColors.AXIS_LINE_COLOR,
 		strokeWidth: 2
 	},
 	"& .vx-axis-tick": {
-		fill: f.visualElementsColors.AXIS_TICK_COLOR,
+		fill: m.visualElementsColors.AXIS_TICK_COLOR,
 		"& line": {
-			stroke: f.visualElementsColors.AXIS_TICK_COLOR,
+			stroke: m.visualElementsColors.AXIS_TICK_COLOR,
 			strokeWidth: 2
 		},
 		fontFamily: e.typography.body1?.fontFamily,
@@ -45,14 +45,14 @@ var x = l("text")(({ theme: e }) => ({
 	}
 })), w = (e) => ({
 	borderRadius: e.spacing(2),
-	color: f.defaults.WHITE,
+	color: m.defaults.WHITE,
 	fontSize: "16px",
 	width: "16px",
 	height: "16px",
 	padding: "2px",
-	border: `1px solid ${f.defaults.WHITE}`,
+	border: `1px solid ${m.defaults.WHITE}`,
 	boxSizing: "unset"
-}), T = { backgroundColor: f.incorrectWithIcon() }, E = { backgroundColor: f.correct() }, D = class extends s.Component {
+}), T = { backgroundColor: m.incorrectWithIcon() }, E = { backgroundColor: m.correct() }, D = class extends s.Component {
 	static propTypes = {
 		defineChart: c.bool,
 		error: c.any
@@ -112,15 +112,15 @@ var x = l("text")(({ theme: e }) => ({
 		return n;
 	};
 	render() {
-		let { categories: e, xBand: t, bandWidth: i, barWidth: a, rotate: s, top: c, graphProps: l, defineChart: u, chartingOptions: f, x: h, y: g, formattedValue: _, changeInteractiveEnabled: v, changeEditableEnabled: y, error: b, autoFocus: C, hiddenLabelRef: D, showCorrectness: O } = this.props;
+		let { categories: e, xBand: t, bandWidth: i, barWidth: a, rotate: s, top: c, graphProps: l, defineChart: u, chartingOptions: m, x: h, y: g, formattedValue: _, changeInteractiveEnabled: v, changeEditableEnabled: y, error: b, autoFocus: C, hiddenLabelRef: D, showCorrectness: O } = this.props;
 		if (!_) return null;
 		let k = {
 			correctnessIcon: w,
 			incorrectIcon: T,
 			correctIcon: E
-		}, { dialog: A } = this.state, { changeEditable: j, changeInteractive: M } = f || {}, N = parseInt(_.split("-")[0], 10), P = e[N], { editable: F, interactive: I, label: L, correctness: R } = P || {}, z = t(r({ label: L }, N)), B = (e || []).reduce((e, t) => (e && e.label ? e.label.length : 0) > (t && t.label ? t.label.length : 0) ? e : t, { label: "" }), V = b ? [...new Set(Object.values(b))].join(" ") : "";
-		return /* @__PURE__ */ m("g", { children: [
-			/* @__PURE__ */ m("foreignObject", {
+		}, { dialog: A } = this.state, { changeEditable: j, changeInteractive: M } = m || {}, N = parseInt(_.split("-")[0], 10), P = e[N], { editable: F, interactive: I, label: L, correctness: R } = P || {}, z = t(r({ label: L }, N)), B = (e || []).reduce((e, t) => (e && e.label ? e.label.length : 0) > (t && t.label ? t.label.length : 0) ? e : t, { label: "" }), V = b ? [...new Set(Object.values(b))].join(" ") : "";
+		return /* @__PURE__ */ p("g", { children: [
+			/* @__PURE__ */ p("foreignObject", {
 				x: i ? z : h - a / 2,
 				y: 18,
 				width: a,
@@ -129,14 +129,14 @@ var x = l("text")(({ theme: e }) => ({
 					pointerEvents: "none",
 					overflow: "visible"
 				},
-				children: [N === 0 && /* @__PURE__ */ p(o, {
+				children: [N === 0 && /* @__PURE__ */ f(o, {
 					isHiddenLabel: !0,
 					inputRef: D,
 					disabled: !0,
 					mark: B,
 					graphProps: l,
 					barWidth: a
-				}), /* @__PURE__ */ p(o, {
+				}), /* @__PURE__ */ f(o, {
 					autoFocus: u && C,
 					inputRef: (e) => this.input = e,
 					disabled: !u && !F,
@@ -148,23 +148,23 @@ var x = l("text")(({ theme: e }) => ({
 					correctness: R,
 					error: b && b[N],
 					limitCharacters: !0,
-					correctnessIndicator: O && R && /* @__PURE__ */ p(n, {
+					correctnessIndicator: O && R && /* @__PURE__ */ f(n, {
 						correctness: R,
 						interactive: I,
 						classes: k
 					})
 				})]
 			}),
-			b && N === 0 && /* @__PURE__ */ p(x, {
+			b && N === 0 && /* @__PURE__ */ f(x, {
 				y: g + 23,
 				height: 6,
 				textAnchor: "start",
 				children: V
 			}),
-			u && N === 0 && /* @__PURE__ */ m("svg", {
+			u && N === 0 && /* @__PURE__ */ p("svg", {
 				x: -55,
 				style: { overflow: "visible" },
-				children: [v && /* @__PURE__ */ p("text", {
+				children: [v && /* @__PURE__ */ f("text", {
 					y: g + 90 + c,
 					width: a,
 					height: 4,
@@ -175,12 +175,12 @@ var x = l("text")(({ theme: e }) => ({
 						maxWidth: a,
 						display: "inline-block"
 					},
-					children: this.splitText(M?.authoringLabel, 20).map((e, t) => /* @__PURE__ */ p("tspan", {
+					children: this.splitText(M?.authoringLabel, 20).map((e, t) => /* @__PURE__ */ f("tspan", {
 						x: "0",
 						dy: `${t > 0 ? "1.2em" : ".6em"}`,
 						children: e
 					}, t))
-				}), y && /* @__PURE__ */ p("text", {
+				}), y && /* @__PURE__ */ f("text", {
 					y: g + 145 + c,
 					width: a,
 					height: 4,
@@ -191,14 +191,14 @@ var x = l("text")(({ theme: e }) => ({
 						maxWidth: a,
 						display: "inline-block"
 					},
-					children: this.splitText(j?.authoringLabel, 20).map((e, t) => /* @__PURE__ */ p("tspan", {
+					children: this.splitText(j?.authoringLabel, 20).map((e, t) => /* @__PURE__ */ f("tspan", {
 						x: "0",
 						dy: `${t > 0 ? "1.2em" : ".6em"}`,
 						children: e
 					}, t))
 				})]
 			}),
-			u && v && /* @__PURE__ */ p("foreignObject", {
+			u && v && /* @__PURE__ */ f("foreignObject", {
 				x: h - 24,
 				y: g + 80 + c,
 				width: a,
@@ -207,13 +207,13 @@ var x = l("text")(({ theme: e }) => ({
 					pointerEvents: "visible",
 					overflow: "visible"
 				},
-				children: /* @__PURE__ */ p(S, {
+				children: /* @__PURE__ */ f(S, {
 					style: { position: "fixed" },
 					checked: I,
 					onChange: (e) => this.changeInteractive(N, e.target.checked)
 				})
 			}),
-			u && y && /* @__PURE__ */ p("foreignObject", {
+			u && y && /* @__PURE__ */ f("foreignObject", {
 				x: h - 24,
 				y: g + 130 + c,
 				width: a,
@@ -222,13 +222,13 @@ var x = l("text")(({ theme: e }) => ({
 					pointerEvents: "visible",
 					overflow: "visible"
 				},
-				children: /* @__PURE__ */ p(S, {
+				children: /* @__PURE__ */ f(S, {
 					style: { position: "fixed" },
 					checked: F,
 					onChange: (e) => this.changeEditable(N, e.target.checked)
 				})
 			}),
-			/* @__PURE__ */ p("foreignObject", {
+			/* @__PURE__ */ f("foreignObject", {
 				x: h - 24,
 				y: g + 100 + c,
 				width: a,
@@ -237,7 +237,7 @@ var x = l("text")(({ theme: e }) => ({
 					pointerEvents: "visible",
 					overflow: "visible"
 				},
-				children: /* @__PURE__ */ p(d, {
+				children: /* @__PURE__ */ f(d, {
 					open: A.open,
 					title: A.title,
 					text: A.text,
@@ -325,11 +325,11 @@ var O = class extends s.Component {
 		e.categories !== this.props.categories && (this._updateTimer && clearTimeout(this._updateTimer), this._updateTimer = setTimeout(() => this.measureHiddenLabel(), 50));
 	}
 	render() {
-		let { graphProps: n, xBand: r, leftAxis: o, onChange: s, onChangeCategory: c, categories: l = [], top: u, defineChart: d, chartingOptions: f, changeInteractiveEnabled: h, changeEditableEnabled: g, theme: _, autoFocus: v, onAutoFocusUsed: y, error: b, showCorrectness: x } = this.props, { scale: S = {}, range: w = {}, domain: T = {}, size: E = {} } = n || {}, { height: O, width: k } = this.state, A = r && typeof r.rangeRound == "function" && r.rangeRound([0, E.width]), j = r && typeof r.bandwidth == "function" && r.bandwidth(), M = j || S.x && S.x(T.max) / l.length, N = a({
+		let { graphProps: n, xBand: r, leftAxis: o, onChange: s, onChangeCategory: c, categories: l = [], top: u, defineChart: d, chartingOptions: m, changeInteractiveEnabled: h, changeEditableEnabled: g, theme: _, autoFocus: v, onAutoFocusUsed: y, error: b, showCorrectness: x } = this.props, { scale: S = {}, range: w = {}, domain: T = {}, size: E = {} } = n || {}, { height: O, width: k } = this.state, A = r && typeof r.rangeRound == "function" && r.rangeRound([0, E.width]), j = r && typeof r.bandwidth == "function" && r.bandwidth(), M = j || S.x && S.x(T.max) / l.length, N = a({
 			...w,
 			step: w.labelStep
 		}), P = i(_ && _.typography ? _.typography.fontSize : 14, O), F = k > M ? 25 : 0;
-		return /* @__PURE__ */ m(C, { children: [o && /* @__PURE__ */ p(e, {
+		return /* @__PURE__ */ p(C, { children: [o && /* @__PURE__ */ f(e, {
 			scale: S.y,
 			tickLength: 10,
 			tickFormat: (e) => e,
@@ -338,13 +338,13 @@ var O = class extends s.Component {
 				dy: 4,
 				dx: -10 - (e.toLocaleString().length || 1) * 5
 			})
-		}), /* @__PURE__ */ p(t, {
+		}), /* @__PURE__ */ f(t, {
 			scale: A,
 			labelProps: { y: 60 + u },
 			top: S.y && S.y(w.min),
 			textLabelProps: () => ({ textAnchor: "middle" }),
 			tickFormat: (e) => e,
-			tickComponent: (e) => /* @__PURE__ */ p(D, {
+			tickComponent: (e) => /* @__PURE__ */ f(D, {
 				hiddenLabelRef: this.setHiddenLabelRef,
 				categories: l,
 				xBand: r,
@@ -353,7 +353,7 @@ var O = class extends s.Component {
 				rotate: P || F,
 				top: u,
 				defineChart: d,
-				chartingOptions: f,
+				chartingOptions: m,
 				autoFocus: v,
 				onAutoFocusUsed: y,
 				error: b,

package/dist/bars/common/bars.js

@@ -1,5 +1,5 @@
-import e from "../../node_modules/.bun/@visx_group@3.12.0_f4eacebf2041cd4f/node_modules/@visx/group/esm/Group.js";
-import t from "../../node_modules/.bun/@visx_shape@3.12.0_f4eacebf2041cd4f/node_modules/@visx/shape/esm/shapes/Bar.js";
+import e from "../../node_modules/.bun/@visx_group@4.0.0_d84c32d47042070f/node_modules/@visx/group/esm/Group.js";
+import t from "../../node_modules/.bun/@visx_shape@4.0.0_d84c32d47042070f/node_modules/@visx/shape/esm/shapes/Bar.js";
 import { bandKey as n } from "../../utils.js";
 import { D as r, DragHandle as i } from "../../common/drag-handle.js";
 import { CorrectCheckIcon as a } from "./correct-check-icon.js";
@@ -8,8 +8,8 @@ import s from "prop-types";
 import { styled as c } from "@mui/material/styles";
 import l from "debug";
 import { types as u } from "@pie-lib/plot";
-import { color as d } from "@pie-lib/render-ui";
-import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
+import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
+import { color as m } from "@pie-lib/render-ui";
 //#region src/bars/common/bars.tsx
 var h = l("pie-lib:chart:bars"), g = [
 	"#006699",
@@ -37,7 +37,7 @@ var h = l("pie-lib:chart:bars"), g = [
 	"#167A7A",
 	"#91862D",
 	"#894A65"
-], v = (e, t, n, r, i) => e && t && i ? r[n % r.length] : e && i ? d.visualElementsColors.ROLLOVER_FILL_BAR_COLOR : t || null, y = c(t)(() => ({ fill: d.defaults.TERTIARY })), b = class extends o.Component {
+], v = (e, t, n, r, i) => e && t && i ? r[n % r.length] : e && i ? m.visualElementsColors.ROLLOVER_FILL_BAR_COLOR : t || null, y = c(t)(() => ({ fill: m.defaults.TERTIARY })), b = class extends o.Component {
 	static propTypes = {
 		barColor: s.string,
 		onChangeCategory: s.func,
@@ -90,14 +90,14 @@ var h = l("pie-lib:chart:bars"), g = [
 	};
 	render() {
 		let { graphProps: e, value: t, label: o, xBand: s, index: c, interactive: l, correctness: u, barColor: h, defineChart: g, correctData: b } = this.props, { scale: x, range: S } = e, { dragValue: C, isHovered: w } = this.state, T = v(w, h, c, _, l && !u), E = Number.isFinite(C) ? C : t, D = s.bandwidth(), O = x.y(S.max - E), k = s(n({ label: o }, c)), A = S.max - E, j = S.max - A, M = b ? b.find((e) => e.label === o) : null, N = l ? r : i, P = !!h;
-		return /* @__PURE__ */ m("g", {
+		return /* @__PURE__ */ p("g", {
 			ref: (e) => this.gRef = e,
 			onMouseEnter: this.handleMouseEnter,
 			onMouseLeave: this.handleMouseLeave,
 			onTouchStart: this.handleMouseEnter,
 			onTouchEnd: this.handleMouseLeave,
 			children: [
-				/* @__PURE__ */ p(y, {
+				/* @__PURE__ */ f(y, {
 					x: k,
 					y: x.y(j),
 					width: D,
@@ -107,8 +107,8 @@ var h = l("pie-lib:chart:bars"), g = [
 				u && u.value === "incorrect" && (() => {
 					let e = parseFloat(M && M.value);
 					if (isNaN(e)) return null;
-					let t = x.y(S.max - e), n = O, r = Math.abs(t - n), i = x.y(e), o = t > n ? d.borderGray() : d.defaults.WHITE, s = t > n ? i : i - r;
-					return /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(y, {
+					let t = x.y(S.max - e), n = O, r = Math.abs(t - n), i = x.y(e), o = t > n ? m.borderGray() : m.defaults.WHITE, s = t > n ? i : i - r;
+					return /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ f(y, {
 						x: k + 2,
 						y: s,
 						width: D - 4,
@@ -119,15 +119,15 @@ var h = l("pie-lib:chart:bars"), g = [
 							strokeDasharray: "5,2",
 							fill: "none"
 						}
-					}), /* @__PURE__ */ p("foreignObject", {
+					}), /* @__PURE__ */ f("foreignObject", {
 						x: k + D - (P ? 24 : 14),
 						y: i - 12,
 						width: 24,
 						height: 24,
-						children: /* @__PURE__ */ p(a, { dashColor: o })
+						children: /* @__PURE__ */ f(a, { dashColor: o })
 					})] });
 				})(),
-				/* @__PURE__ */ p(N, {
+				/* @__PURE__ */ f(N, {
 					x: k,
 					y: E,
 					defineChart: g,
@@ -155,7 +155,7 @@ var h = l("pie-lib:chart:bars"), g = [
 	};
 	render() {
 		let { data: t, graphProps: n, xBand: r, onChangeCategory: i, defineChart: a, histogram: o, correctData: s } = this.props;
-		return /* @__PURE__ */ p(e, { children: (t || []).map((e, t) => /* @__PURE__ */ p(x, {
+		return /* @__PURE__ */ f(e, { children: (t || []).map((e, t) => /* @__PURE__ */ f(x, {
 			value: e.value,
 			interactive: a || e.interactive,
 			defineChart: a,

package/dist/chart-setup.js

@@ -3,8 +3,8 @@ import { useEffect as t, useState as n } from "react";
 import r from "prop-types";
 import { styled as i } from "@mui/material/styles";
 import { AlertDialog as a, NumberTextFieldCustom as o } from "@pie-lib/config-ui";
-import { color as s } from "@pie-lib/render-ui";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { color as l } from "@pie-lib/render-ui";
 import u from "@mui/material/Typography";
 //#region src/chart-setup.tsx
 var d = (e, t, n, r, i) => {
@@ -39,14 +39,14 @@ var d = (e, t, n, r, i) => {
 	justifyContent: "space-between",
 	alignItems: "center",
 	margin: `${e.spacing(3)} 0`
-})), y = i(u)(() => ({ color: s.disabled() })), b = (r) => {
-	let { model: i, onChange: o, chartDimensions: s, gridValues: b = {}, labelValues: x = {}, studentNewCategoryDefaultLabel: S = {}, availableChartTypes: C = {}, chartTypeLabel: w } = r, [T, E] = n({
+})), y = i(u)(() => ({ color: l.disabled() })), b = (r) => {
+	let { model: i, onChange: o, chartDimensions: l, gridValues: b = {}, labelValues: x = {}, studentNewCategoryDefaultLabel: S = {}, availableChartTypes: C = {}, chartTypeLabel: w } = r, [T, E] = n({
 		open: !1,
 		title: "",
 		text: "",
 		onClose: null,
 		onConfirm: null
-	}), [D, O] = n(!1), [k, A] = n(""), [j, M] = n(0), { range: N = {}, correctAnswer: P, changeInteractiveEnabled: F, changeEditableEnabled: I } = i, L = i.graph, { showInConfigPanel: R, width: z, height: B } = s || {}, V = {
+	}), [D, O] = n(!1), [k, A] = n(""), [j, M] = n(0), { range: N = {}, correctAnswer: P, changeInteractiveEnabled: F, changeEditableEnabled: I } = i, L = i.graph, { showInConfigPanel: R, width: z, height: B } = l || {}, V = {
 		min: z?.min ? Math.max(50, z.min) : 50,
 		max: z?.max ? Math.min(700, z.max) : 700,
 		step: z?.step >= 1 ? Math.min(200, z.step) : 20
@@ -60,13 +60,13 @@ var d = (e, t, n, r, i) => {
 	}, W = x && x.range ? { customValues: x.range } : {
 		min: 0,
 		max: 1e4
-	}, G = /* @__PURE__ */ l(h, { children: [/* @__PURE__ */ c(_, {
+	}, G = /* @__PURE__ */ c(h, { children: [/* @__PURE__ */ s(_, {
 		label: "Grid Interval",
 		value: N.step,
 		variant: "outlined",
 		onChange: (e, t) => $("step", t, e),
 		...U
-	}), /* @__PURE__ */ c(_, {
+	}), /* @__PURE__ */ s(_, {
 		label: "Label Interval",
 		value: N.labelStep,
 		variant: "outlined",
@@ -162,18 +162,18 @@ var d = (e, t, n, r, i) => {
 			chartType: e
 		});
 	};
-	return /* @__PURE__ */ l(f, { children: [
-		/* @__PURE__ */ c(u, {
+	return /* @__PURE__ */ c(f, { children: [
+		/* @__PURE__ */ s(u, {
 			variant: "subtitle1",
 			children: "Configure Chart"
 		}),
-		/* @__PURE__ */ l(p, { children: [
-			/* @__PURE__ */ l(h, { children: [/* @__PURE__ */ c(e, {
+		/* @__PURE__ */ c(p, { children: [
+			/* @__PURE__ */ c(h, { children: [/* @__PURE__ */ s(e, {
 				value: i.chartType,
 				onChange: (e) => ne(e.target.value),
 				availableChartTypes: C,
 				chartTypeLabel: w
-			}), /* @__PURE__ */ c(_, {
+			}), /* @__PURE__ */ s(_, {
 				label: "Max Value",
 				value: N.max,
 				min: X(i.chartType).min,
@@ -182,9 +182,9 @@ var d = (e, t, n, r, i) => {
 				onChange: (e, t) => $("max", t, e)
 			})] }),
 			!i.chartType.includes("Plot") && G,
-			R && /* @__PURE__ */ l(v, { children: [
-				/* @__PURE__ */ c("div", { children: /* @__PURE__ */ c(u, { children: "Dimensions(px)" }) }),
-				/* @__PURE__ */ l(m, { children: [/* @__PURE__ */ c(g, {
+			R && /* @__PURE__ */ c(v, { children: [
+				/* @__PURE__ */ s("div", { children: /* @__PURE__ */ s(u, { children: "Dimensions(px)" }) }),
+				/* @__PURE__ */ c(m, { children: [/* @__PURE__ */ s(g, {
 					label: "Width",
 					value: L.width,
 					min: V.min,
@@ -192,8 +192,8 @@ var d = (e, t, n, r, i) => {
 					step: V.step,
 					variant: "outlined",
 					onChange: (e, t) => Z("width", t)
-				}), /* @__PURE__ */ c(y, { children: "Min 50, Max 700" })] }),
-				/* @__PURE__ */ l(m, { children: [/* @__PURE__ */ c(g, {
+				}), /* @__PURE__ */ s(y, { children: "Min 50, Max 700" })] }),
+				/* @__PURE__ */ c(m, { children: [/* @__PURE__ */ s(g, {
 					label: "Height",
 					value: L.height,
 					min: H.min,
@@ -201,10 +201,10 @@ var d = (e, t, n, r, i) => {
 					step: H.step,
 					variant: "outlined",
 					onChange: (e, t) => Z("height", t)
-				}), /* @__PURE__ */ c(y, { children: "Min 400, Max 700" })] })
+				}), /* @__PURE__ */ s(y, { children: "Min 400, Max 700" })] })
 			] })
 		] }),
-		/* @__PURE__ */ c(a, {
+		/* @__PURE__ */ s(a, {
 			open: T.open,
 			title: T.title,
 			text: T.text,

package/dist/common/correctness-indicators.js

@@ -1,22 +1,22 @@
 import "react";
 import e from "prop-types";
 import { styled as t } from "@mui/material/styles";
-import { color as n } from "@pie-lib/render-ui";
-import { jsx as r } from "react/jsx-runtime";
+import { jsx as n } from "react/jsx-runtime";
+import { color as r } from "@pie-lib/render-ui";
 import i from "@mui/icons-material/Check";
 import a from "@mui/icons-material/Close";
 //#region src/common/correctness-indicators.tsx
 var o = t(i)(({ theme: e }) => ({
 	borderRadius: e.spacing(2),
-	color: n.defaults.WHITE,
+	color: r.defaults.WHITE,
 	fontSize: "16px",
 	width: "16px",
 	height: "16px",
 	padding: "2px",
-	border: `1px solid ${n.defaults.WHITE}`,
+	border: `1px solid ${r.defaults.WHITE}`,
 	stroke: "initial",
 	boxSizing: "unset",
-	backgroundColor: n.correct(),
+	backgroundColor: r.correct(),
 	display: "block",
 	"&.small": {
 		fontSize: "10px",
@@ -25,49 +25,49 @@ var o = t(i)(({ theme: e }) => ({
 	}
 })), s = t(a)(({ theme: e }) => ({
 	borderRadius: e.spacing(2),
-	color: n.defaults.WHITE,
+	color: r.defaults.WHITE,
 	fontSize: "16px",
 	width: "16px",
 	height: "16px",
 	padding: "2px",
-	border: `1px solid ${n.defaults.WHITE}`,
+	border: `1px solid ${r.defaults.WHITE}`,
 	stroke: "initial",
 	boxSizing: "unset",
-	backgroundColor: n.incorrectWithIcon(),
+	backgroundColor: r.incorrectWithIcon(),
 	display: "block",
 	"&.small": {
 		fontSize: "10px",
 		width: "10px",
 		height: "10px"
 	}
-})), c = ({ scale: e, x: t, y: n, correctness: i, interactive: a }) => {
+})), c = ({ scale: e, x: t, y: r, correctness: i, interactive: a }) => {
 	if (!i || !a) return null;
-	let c = e ? e.x(t) : t, l = e ? e.y(n) : n, u = i.value === "correct";
-	return /* @__PURE__ */ r("foreignObject", {
+	let c = e ? e.x(t) : t, l = e ? e.y(r) : r, u = i.value === "correct";
+	return /* @__PURE__ */ n("foreignObject", {
 		x: c - 11,
 		y: l - 11,
 		width: 22,
 		height: 22,
-		children: r(u ? o : s, { title: i.label })
+		children: n(u ? o : s, { title: i.label })
 	});
-}, l = ({ scale: e, x: t, correctness: n, correctData: i, label: a }) => {
-	if (n && n.value === "incorrect") {
+}, l = ({ scale: e, x: t, correctness: r, correctData: i, label: a }) => {
+	if (r && r.value === "incorrect") {
 		let s = parseFloat(i.find((e) => e.label === a)?.value);
 		if (isNaN(s)) return null;
 		let c = e.y(s) - 7.5;
-		return /* @__PURE__ */ r("foreignObject", {
+		return /* @__PURE__ */ n("foreignObject", {
 			x: e.x(t) - 7.5,
 			y: c,
 			width: 15,
 			height: 15,
-			children: /* @__PURE__ */ r(o, {
+			children: /* @__PURE__ */ n(o, {
 				className: "small",
-				title: n.label
+				title: r.label
 			})
 		});
 	}
 	return null;
-}, u = ({ correctness: e, interactive: t }) => !e || !t ? null : e.value === "correct" ? /* @__PURE__ */ r(o, { title: e.label }) : /* @__PURE__ */ r(s, { title: e.label });
+}, u = ({ correctness: e, interactive: t }) => !e || !t ? null : e.value === "correct" ? /* @__PURE__ */ n(o, { title: e.label }) : /* @__PURE__ */ n(s, { title: e.label });
 c.propTypes = {
 	scale: e.shape({
 		x: e.func,