@deviceinsight/ng-ui-components 7.22.0 → 7.22.1

package/dist/index.js

@@ -35,32 +35,9 @@ import Dropzone from "react-dropzone";
 import { AsyncPaginate } from "react-select-async-paginate";
 import { SVG } from "@svgdotjs/svg.js";
 import Highcharts from "highcharts";
-import HighchartsReact from "highcharts-react-official";
+import { HighchartsReact } from "highcharts-react-official";
 import Slider$1 from "@rc-component/slider";
 import Tooltip from "@rc-component/tooltip";
-//#region \0rolldown/runtime.js
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __commonJSMin = (cb, mod) => () => (mod || (cb((mod = { exports: {} }).exports, mod), cb = null), mod.exports);
-var __copyProps = (to, from, except, desc) => {
-	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
-		key = keys[i];
-		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-			get: ((k) => from[k]).bind(null, key),
-			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-		});
-	}
-	return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
-	value: mod,
-	enumerable: true
-}) : target, mod));
-//#endregion
 //#region src/modules/messageBox/messageBox.tsx
 var groupNamesToToastIds = {};
 var DEFAULT_AUTO_CLOSE_MS = 3e3;
@@ -3309,9 +3286,10 @@ var getClickConfiguration = (onClick) => {
 var Chart = class extends Component {
 	constructor(..._args) {
 		super(..._args);
-		this.state = {};
+		this.state = { titleApplied: false };
 		this.chart = null;
 		this.ro = null;
+		this.titleTimeoutId = void 0;
 		this.handleChart = (chart) => {
 			this.chart = chart;
 			this.ro = new ResizeObserver(() => {
@@ -3321,8 +3299,16 @@ var Chart = class extends Component {
 		};
 	}
 	componentDidMount() {
+		this.titleTimeoutId = setTimeout(() => this.setState({ titleApplied: true }), 0);
+	}
+	/**
+	* Builds the Highcharts configuration from the props. Everything here is derived, so it is
+	* rebuilt while rendering rather than mirrored into state.
+	*/
+	buildOptions() {
 		const { type, title, items, tooltipTitle, valueFormatter, onClick } = this.props;
-		this.setState({
+		const { titleApplied } = this.state;
+		return {
 			...initialOptions,
 			plotOptions: {
 				...initialOptions.plotOptions,
@@ -3339,44 +3325,12 @@ var Chart = class extends Component {
 				...initialOptions.legend,
 				enabled: type === "pie"
 			},
-			yAxis: {
-				...initialOptions.yAxis,
-				enabled: type === "column",
-				title: { text: title || "" }
-			},
-			series: [{
-				type,
-				innerSize: "50%",
-				data: items.map(({ label, value }) => [label, value])
-			}]
-		});
-		setTimeout(() => {
-			this.setState({ title: {
-				...initialOptions.title,
-				text: type === "column" ? "" : title || ""
-			} });
-		}, 0);
-	}
-	componentDidUpdate(prevProps) {
-		const { type, title, items, tooltipTitle, valueFormatter, onClick } = this.props;
-		if (title !== prevProps.title) this.setState({
 			title: {
-				...this.state.title,
-				text: type === "column" ? "" : title || ""
-			},
-			yAxis: {
-				...this.state.yAxis,
-				title: { text: title || "" }
-			}
-		});
-		if (type !== prevProps.type) this.setState({
-			legend: {
-				...this.state.legend,
-				enabled: type === "pie"
+				...initialOptions.title,
+				text: titleApplied && type !== "column" ? title || "" : ""
 			},
-			title: { text: type === "column" ? "" : title || "" },
 			yAxis: {
-				...this.state.yAxis,
+				...initialOptions.yAxis,
 				enabled: type === "column",
 				title: { text: type === "column" ? title || "" : "" }
 			},
@@ -3385,35 +3339,19 @@ var Chart = class extends Component {
 				innerSize: "50%",
 				data: items.map(({ label, value }) => [label, value])
 			}]
-		});
-		if (!isEqual(items, prevProps.items)) this.setState({ series: [{
-			type,
-			innerSize: "50%",
-			data: items.map(({ label, value }) => [label, value])
-		}] });
-		if (tooltipTitle !== prevProps.tooltipTitle || valueFormatter !== prevProps.valueFormatter || onClick !== prevProps.onClick) this.setState({
-			tooltip: {
-				...initialOptions.tooltip,
-				formatter() {
-					const format = valueFormatter || ((value) => value);
-					return createTooltip(tooltipTitle || "", this.point.name, format(this.point.y));
-				}
-			},
-			plotOptions: {
-				...initialOptions.plotOptions,
-				...getClickConfiguration(onClick)
-			}
-		});
+		};
 	}
 	componentWillUnmount() {
+		clearTimeout(this.titleTimeoutId);
 		if (this.ro && this.chart?.renderTo) this.ro.unobserve(this.chart.renderTo);
 		this.chart = null;
 		this.ro = null;
 	}
 	render() {
+		const built = this.buildOptions();
 		return /* @__PURE__ */ jsx(HighchartsReact, {
 			highcharts: Highcharts,
-			options: this.props.updateOptions ? this.props.updateOptions(this.state) : this.state,
+			options: this.props.updateOptions ? this.props.updateOptions(built) : built,
 			containerProps: { className: this.props.className },
 			callback: this.handleChart
 		});
@@ -3421,54 +3359,15 @@ var Chart = class extends Component {
 };
 //#endregion
 //#region src/components/slider/RcSliderWithTooltip.tsx
-var import_raf = /* @__PURE__ */ __toESM((/* @__PURE__ */ __commonJSMin(((exports) => {
-	Object.defineProperty(exports, "__esModule", { value: true });
-	exports.default = void 0;
-	var raf = (callback) => +setTimeout(callback, 16);
-	var caf = (num) => clearTimeout(num);
-	if (typeof window !== "undefined" && "requestAnimationFrame" in window) {
-		raf = (callback) => window.requestAnimationFrame(callback);
-		caf = (handle) => window.cancelAnimationFrame(handle);
-	}
-	var rafUUID = 0;
-	var rafIds = /* @__PURE__ */ new Map();
-	function cleanup(id) {
-		rafIds.delete(id);
-	}
-	var wrapperRaf = (callback, times = 1) => {
-		rafUUID += 1;
-		const id = rafUUID;
-		function callRef(leftTimes) {
-			if (leftTimes === 0) {
-				cleanup(id);
-				callback();
-			} else {
-				const realId = raf(() => {
-					callRef(leftTimes - 1);
-				});
-				rafIds.set(id, realId);
-			}
-		}
-		callRef(times);
-		return id;
-	};
-	wrapperRaf.cancel = (id) => {
-		const realId = rafIds.get(id);
-		cleanup(id);
-		return caf(realId);
-	};
-	if (process.env.NODE_ENV !== "production") wrapperRaf.ids = () => rafIds;
-	exports.default = wrapperRaf;
-})))(), 1);
 var HandleTooltip = (props) => {
 	const { value, children, visible, tipFormatter = (val) => `${val}`, ...restProps } = props;
 	const tooltipRef = useRef(null);
 	const rafRef = useRef(null);
 	function cancelKeepAlign() {
-		if (rafRef.current) import_raf.default.cancel(rafRef.current);
+		if (rafRef.current) cancelAnimationFrame(rafRef.current);
 	}
 	function keepAlign() {
-		rafRef.current = (0, import_raf.default)(() => {
+		rafRef.current = requestAnimationFrame(() => {
 			tooltipRef.current?.forceAlign();
 		});
 	}