import { c } from "react-compiler-runtime";
import React from "react";
import { Avatar, Typography, alpha, makeStyles } from "@material-ui/core";
import clsx from "clsx";
//#region src/UI/dataDisplay/entityHeader/ui/EntityHeaderStatListItem.jsx
const useStyles = makeStyles((theme) => ({
	root: {
		display: "flex",
		flexDirection: "row",
		alignItems: "center"
	},
	rootFlexGrow: { flexGrow: 1 },
	rootBlock: (props) => ({
		justifyContent: "center",
		padding: theme.spacing(1)
	}),
	rootBlockDefault: (props) => ({ backgroundColor: alpha(theme.palette.type === "dark" ? theme.palette.common.black : theme.palette.common.white, .25) }),
	rootBlockError: (props) => ({ backgroundColor: alpha(theme.palette.error.main, theme.palette.type === "dark" ? .7 : .1) }),
	rootBlockSuccess: (props) => ({ backgroundColor: alpha(theme.palette.success.main, theme.palette.type === "dark" ? .2 : .3) }),
	labelRoot: {
		color: "inherit",
		opacity: .6
	},
	rootLabelError: (props) => ({ color: theme.palette.error.main }),
	rootLabelSuccess: (props) => ({ color: theme.palette.success.main }),
	valueRoot: {
		color: "inherit",
		fontWeight: theme.typography.fontWeightMedium,
		display: "flex",
		justifyContent: "center",
		alignItems: "center"
	},
	beforeValue: { marginRight: theme.spacing(.3) },
	afterValue: {},
	icon: { marginRight: theme.spacing(1) },
	iconAvatar: { backgroundColor: "transparent" },
	content: (props) => ({
		display: "flex",
		flexDirection: "column",
		alignItems: props.icon ? "left" : "center"
	})
}));
const EntityHeaderStatListItem = (props) => {
	const $ = c(30);
	const { label: t0, value: t1, beforeValue, afterValue, flexGrow: t2, labelColor, icon } = props;
	const label = t0 === void 0 ? "Label" : t0;
	const value = t1 === void 0 ? "Value" : t1;
	const flexGrow = t2 === void 0 ? false : t2;
	const classes = useStyles(props);
	let t3;
	if ($[0] !== classes.root || $[1] !== classes.rootBlock || $[2] !== classes.rootFlexGrow || $[3] !== flexGrow) {
		t3 = clsx({
			[classes.root]: true,
			[classes.rootFlexGrow]: flexGrow,
			[classes.rootBlock]: true
		});
		$[0] = classes.root;
		$[1] = classes.rootBlock;
		$[2] = classes.rootFlexGrow;
		$[3] = flexGrow;
		$[4] = t3;
	} else t3 = $[4];
	let t4;
	if ($[5] !== classes.icon || $[6] !== classes.iconAvatar || $[7] !== icon) {
		t4 = icon && /* @__PURE__ */ React.createElement("div", { className: classes.icon }, /* @__PURE__ */ React.createElement(Avatar, { className: classes.iconAvatar }, icon));
		$[5] = classes.icon;
		$[6] = classes.iconAvatar;
		$[7] = icon;
		$[8] = t4;
	} else t4 = $[8];
	let t5;
	if ($[9] !== afterValue || $[10] !== beforeValue || $[11] !== classes.afterValue || $[12] !== classes.beforeValue || $[13] !== classes.rootLabelError || $[14] !== classes.rootLabelSuccess || $[15] !== classes.valueRoot || $[16] !== labelColor || $[17] !== value) {
		t5 = !!value && /* @__PURE__ */ React.createElement("div", { className: clsx({ [classes.valueRoot]: true }) }, beforeValue && /* @__PURE__ */ React.createElement(Typography, {
			variant: "body1",
			className: classes.beforeValue
		}, beforeValue), /* @__PURE__ */ React.createElement(Typography, {
			variant: "h5",
			className: clsx({
				[classes.rootLabelError]: labelColor === "error",
				[classes.rootLabelSuccess]: labelColor === "success"
			})
		}, value), afterValue && /* @__PURE__ */ React.createElement(Typography, {
			variant: "body1",
			className: classes.afterValue
		}, afterValue));
		$[9] = afterValue;
		$[10] = beforeValue;
		$[11] = classes.afterValue;
		$[12] = classes.beforeValue;
		$[13] = classes.rootLabelError;
		$[14] = classes.rootLabelSuccess;
		$[15] = classes.valueRoot;
		$[16] = labelColor;
		$[17] = value;
		$[18] = t5;
	} else t5 = $[18];
	let t6;
	if ($[19] !== classes.labelRoot || $[20] !== label) {
		t6 = !!label && /* @__PURE__ */ React.createElement(Typography, {
			variant: "subtitle3",
			className: classes.labelRoot,
			component: "div"
		}, label);
		$[19] = classes.labelRoot;
		$[20] = label;
		$[21] = t6;
	} else t6 = $[21];
	let t7;
	if ($[22] !== classes.content || $[23] !== t5 || $[24] !== t6) {
		t7 = /* @__PURE__ */ React.createElement("div", { className: classes.content }, t5, t6);
		$[22] = classes.content;
		$[23] = t5;
		$[24] = t6;
		$[25] = t7;
	} else t7 = $[25];
	let t8;
	if ($[26] !== t3 || $[27] !== t4 || $[28] !== t7) {
		t8 = /* @__PURE__ */ React.createElement("div", { className: t3 }, t4, t7);
		$[26] = t3;
		$[27] = t4;
		$[28] = t7;
		$[29] = t8;
	} else t8 = $[29];
	return t8;
};
//#endregion
export { EntityHeaderStatListItem };

//# sourceMappingURL=EntityHeaderStatListItem.mjs.map