@pie-lib/charting 8.0.0-next.35 → 8.0.0-next.36

package/dist/mark-label.js

@@ -13,7 +13,7 @@ var g = u("div")({
 	display: "flex",
 	flexDirection: "column",
 	alignItems: "center"
-});
+}), _ = m.disabledText();
 u("input")(({ theme: e }) => ({
 	float: "right",
 	fontFamily: e.typography.fontFamily,
@@ -24,7 +24,7 @@ u("input")(({ theme: e }) => ({
 	"&.disabledMarkLabel": { backgroundColor: "transparent !important" },
 	"&.error": { border: `2px solid ${e.palette.error.main}` }
 }));
-var _ = u("div")(({ theme: e }) => ({
+var v = u("div")(({ theme: e }) => ({
 	pointerEvents: "auto",
 	textAlign: "center",
 	fontSize: e.typography.fontSize + 2,
@@ -33,90 +33,95 @@ var _ = u("div")(({ theme: e }) => ({
 	paddingTop: e.typography.fontSize / 2,
 	"&.disabledMarkLabel": {
 		...r("color"),
+		color: _,
 		backgroundColor: "transparent !important"
 	},
 	"&.error": { border: `2px solid ${e.palette.error.main}` },
 	"&.correct": { ...n("color") },
 	"&.incorrect": { ...i("color") }
 }));
-function v(e) {
+function y(e) {
 	let t = e?.trim() || "";
 	return (/* @__PURE__ */ new RegExp(/^[1-9]*[0-9]*\s?[1-9][0-9]*\/[1-9][0-9]*$/)).test(t);
 }
-function y(e) {
+function b(e) {
 	let t = e?.trim() || "", n, r = "", i = t.split(" ");
 	n = i[1] && i[1].includes("/") ? i[1].split("/") || "" : t?.split("/") || "";
 	let a;
-	if (v(e)) return i[0] && i[1] && (r = i[0]), a = `\\(${r}\\frac{${n[0]}}{${n[1]}}\\)`, a;
+	if (y(e)) return i[0] && i[1] && (r = i[0]), a = `\\(${r}\\frac{${n[0]}}{${n[1]}}\\)`, a;
 }
-var b = (n) => {
-	let [r, i] = c(null), l = a((e) => i(e), null), { mark: u = {}, disabled: d, inputRef: m, barWidth: v, rotate: b, correctness: x, autoFocus: S, error: C, isHiddenLabel: w, limitCharacters: T, correctnessIndicator: E } = n, [D, O] = c(u.label), [k, A] = c(y(u.label)), [j, M] = c(!1), N = s(null), P = (e) => {
-		T && e.target.value && e.target.value.length > 20 || O(e.target.value);
-	}, F = () => j === !1 && k !== void 0, I = (e) => {
-		A(y(u.label)), M(!1), n.onChange(e.target.value);
-	}, L = {};
-	return b && (L = {
+var x = (n) => {
+	let [r, i] = c(null), l = a((e) => i(e), null), { mark: u = {}, disabled: d, inputRef: m, barWidth: y, rotate: x, correctness: S, autoFocus: C, error: w, isHiddenLabel: T, limitCharacters: E, correctnessIndicator: D } = n, [O, k] = c(u.label), [A, j] = c(b(u.label)), [M, N] = c(!1), P = s(null), F = (e) => {
+		E && e.target.value && e.target.value.length > 20 || k(e.target.value);
+	}, I = () => M === !1 && A !== void 0, L = (e) => {
+		j(b(u.label)), N(!1), n.onChange(e.target.value);
+	}, R = {};
+	return x && (R = {
 		width: "unset",
 		textAlign: "left"
 	}), o(() => {
-		O(u.label);
+		k(u.label);
 	}, [u.label]), o(() => {
-		let e = N.current;
-		e && k && (e.innerHTML = k, h(e));
-	}, [D, k]), /* @__PURE__ */ p(g, { children: [E, F() ? /* @__PURE__ */ f(_, {
+		let e = P.current;
+		e && A && (e.innerHTML = A, h(e));
+	}, [O, A]), /* @__PURE__ */ p(g, { children: [D, I() ? /* @__PURE__ */ f(v, {
 		ref: (e) => {
-			N.current = e, typeof m == "function" && m(e);
+			P.current = e, typeof m == "function" && m(e);
 		},
 		className: e({
 			disabledMarkLabel: d,
-			error: C,
-			correct: u.editable && x?.label === "correct",
-			incorrect: u.editable && x?.label === "incorrect"
+			error: w,
+			correct: u.editable && S?.label === "correct",
+			incorrect: u.editable && S?.label === "incorrect"
 		}),
-		onClick: () => M(!0),
+		onClick: () => N(!0),
 		style: {
-			minWidth: v,
+			minWidth: y,
 			position: "fixed",
 			transformOrigin: "left",
-			transform: `rotate(${b}deg)`,
-			visibility: w ? "hidden" : "unset",
-			marginTop: E ? "24px" : "0"
+			transform: `rotate(${x}deg)`,
+			visibility: T ? "hidden" : "unset",
+			marginTop: D ? "24px" : "0"
 		}
 	}) : /* @__PURE__ */ f(t, {
 		inputRef: (e) => {
 			l(e), typeof m == "function" && m(e);
 		},
 		name: "mark-label-input",
-		autoFocus: j || S,
+		autoFocus: M || C,
 		disabled: d,
-		inputClassName: e(x && u.editable ? x.label : null, d && "disabledMarkLabel", C && "error"),
+		inputClassName: e(S && u.editable ? S.label : null, d && "disabledMarkLabel", w && "error"),
 		inputStyle: {
-			minWidth: v,
+			minWidth: y,
 			textAlign: "center",
 			background: "transparent",
 			boxSizing: "border-box",
 			paddingLeft: 0,
 			paddingRight: 0,
 			border: "none",
-			...L
+			...d ? {
+				color: _,
+				WebkitTextFillColor: _
+			} : {},
+			...R
 		},
-		value: D,
+		value: O,
 		style: {
 			position: "fixed",
 			pointerEvents: "auto",
 			top: 0,
 			left: 0,
-			minWidth: v,
+			minWidth: y,
 			transformOrigin: "left",
-			transform: `rotate(${b}deg)`,
-			visibility: w ? "hidden" : "unset",
-			marginTop: E ? "24px" : "0"
+			transform: `rotate(${x}deg)`,
+			visibility: T ? "hidden" : "unset",
+			marginTop: D ? "24px" : "0"
 		},
-		onChange: P,
-		onBlur: I
+		onChange: F,
+		onBlur: L
 	})] });
 };
-b.propTypes = {
+x.propTypes = {
 	autoFocus: l.bool,
 	disabled: l.bool,
 	error: l.any,
@@ -135,4 +140,4 @@ b.propTypes = {
 	correctnessIndicator: l.node
 };
 //#endregion
-export { b as MarkLabel, b as default };
+export { x as MarkLabel, x as default };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pie-lib/charting",
-  "version": "8.0.0-next.35",
+  "version": "8.0.0-next.36",
   "description": "charting",
   "repository": {
     "type": "git",
@@ -13,8 +13,8 @@
     "@mapbox/point-geometry": "^1.1.0",
     "@mui/icons-material": "^7.3.4",
     "@mui/material": "^7.3.4",
-    "@pie-lib/plot": "5.0.0-next.35",
-    "@pie-lib/render-ui": "6.2.0-next.41",
+    "@pie-lib/plot": "5.0.0-next.36",
+    "@pie-lib/render-ui": "6.2.0-next.42",
     "@pie-lib/translator": "5.0.0-next.3",
     "@visx/axis": "^4.0.0",
     "@visx/event": "^4.0.0",
@@ -29,7 +29,7 @@
     "invariant": "^2.2.4",
     "react-draggable": "^4.7.1",
     "prop-types": "^15.8.1",
-    "@pie-lib/config-ui": "14.0.0-next.35",
+    "@pie-lib/config-ui": "14.0.0-next.36",
     "@pie-element/shared-math-rendering-mathjax": "0.1.1-next.0",
     "@pie-element/shared-lodash": "0.1.1-next.1",
     "clsx": "^2.1.1",