import FluentTrendArrow from "./FluentTrendArrow.mjs";
import { c } from "react-compiler-runtime";
import React from "react";
import { Typography, makeStyles } from "@material-ui/core";
//#region src/UI/widgets/FluentComponents/atoms/FluentStatsSnippet.jsx
const useStyles = makeStyles((theme) => ({
	root: {},
	percent: {
		display: "flex",
		flexDirection: "row",
		marginTop: theme.spacing(-.5)
	},
	arrow: {
		display: "flex",
		flexDirection: "column",
		justifyContent: "center"
	},
	percentAmount: {}
}));
const FluentStatsSnippet = (props) => {
	const $ = c(30);
	const classes = useStyles(props);
	const { label, amount: rawAmount, prevAmount, percent: percentProp, trend: trendProp } = props;
	let amount = rawAmount;
	if (Math.abs(rawAmount) > 1e6) {
		const newNumber = rawAmount / 1e6;
		const t0 = Math.round(newNumber * 10) / 10;
		let t1;
		if ($[0] !== t0) {
			t1 = [t0, "M"];
			$[0] = t0;
			$[1] = t1;
		} else t1 = $[1];
		amount = t1;
	} else if (Math.abs(rawAmount) > 1e3) {
		const newNumber_0 = rawAmount / 1e3;
		const t0 = Math.round(newNumber_0 * 10) / 10;
		let t1;
		if ($[2] !== t0) {
			t1 = [t0, "K"];
			$[2] = t0;
			$[3] = t1;
		} else t1 = $[3];
		amount = t1;
	}
	let percent = percentProp;
	let trend = trendProp;
	if (typeof prevAmount === "number") {
		const ratio = (rawAmount - prevAmount) / prevAmount;
		const roundTo = _temp;
		let t0;
		if ($[4] !== ratio) {
			t0 = Math.abs(roundTo(ratio * 100, Math.abs(ratio) < .01 ? .01 : 1));
			$[4] = ratio;
			$[5] = t0;
		} else t0 = $[5];
		percent = t0 + "%";
		trend = ratio < 0 ? "down" : "up";
	}
	let t0;
	if ($[6] !== label) {
		t0 = /* @__PURE__ */ React.createElement(Typography, {
			variant: "overline",
			component: "div"
		}, label);
		$[6] = label;
		$[7] = t0;
	} else t0 = $[7];
	let t1;
	if ($[8] !== amount || $[9] !== classes.stat) {
		t1 = /* @__PURE__ */ React.createElement(Typography, {
			className: classes.stat,
			variant: "h5",
			component: "div"
		}, amount);
		$[8] = amount;
		$[9] = classes.stat;
		$[10] = t1;
	} else t1 = $[10];
	let t2;
	if ($[11] !== trend) {
		t2 = /* @__PURE__ */ React.createElement(FluentTrendArrow, { type: trend });
		$[11] = trend;
		$[12] = t2;
	} else t2 = $[12];
	let t3;
	if ($[13] !== classes.arrow || $[14] !== t2) {
		t3 = /* @__PURE__ */ React.createElement("div", { className: classes.arrow }, t2);
		$[13] = classes.arrow;
		$[14] = t2;
		$[15] = t3;
	} else t3 = $[15];
	let t4;
	if ($[16] !== percent) {
		t4 = /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, percent);
		$[16] = percent;
		$[17] = t4;
	} else t4 = $[17];
	let t5;
	if ($[18] !== classes.percentAmount || $[19] !== t4) {
		t5 = /* @__PURE__ */ React.createElement("div", { className: classes.percentAmount }, t4);
		$[18] = classes.percentAmount;
		$[19] = t4;
		$[20] = t5;
	} else t5 = $[20];
	let t6;
	if ($[21] !== classes.percent || $[22] !== t3 || $[23] !== t5) {
		t6 = /* @__PURE__ */ React.createElement("div", { className: classes.percent }, t3, t5);
		$[21] = classes.percent;
		$[22] = t3;
		$[23] = t5;
		$[24] = t6;
	} else t6 = $[24];
	let t7;
	if ($[25] !== classes.root || $[26] !== t0 || $[27] !== t1 || $[28] !== t6) {
		t7 = /* @__PURE__ */ React.createElement("div", { className: classes.root }, t0, t1, t6);
		$[25] = classes.root;
		$[26] = t0;
		$[27] = t1;
		$[28] = t6;
		$[29] = t7;
	} else t7 = $[29];
	return t7;
};
function _temp(value, step) {
	if (typeof value !== "number" || typeof step !== "number" || step === 0) return value;
	return Math.round(value / step) * step;
}
//#endregion
export { FluentStatsSnippet as default };

//# sourceMappingURL=FluentStatsSnippet.mjs.map