import { LayoutUnit } from "../../../../layout/LayoutUnit.mjs";
import { SummaryBlock } from "../../../dataDisplay/SummaryBlock.mjs";
import { c } from "react-compiler-runtime";
import React from "react";
import { Box, Divider, Typography, makeStyles } from "@material-ui/core";
import { MuiVegaLite } from "@material-vega/material-ui";
//#region src/UI/surfaces/cards/chartDisplayCards/AmbientSplitStatCard.jsx
const useStyles = makeStyles((theme) => ({
	rootContainer: {
		background: "#FFFFFF",
		boxShadow: "0px 1px 4px rgba(0, 0, 0, 0.08)",
		borderRadius: "6px",
		display: "flex",
		justifyContent: "center",
		flexDirection: "column"
	},
	infoContainer: {
		display: "flex",
		justifyContent: "center",
		paddingLeft: theme.spacing(3)
	},
	divider: {
		width: "100%",
		height: "1px"
	},
	subContainer: {
		display: "flex",
		flexDirection: "column",
		justifyContent: "flex-start",
		alignItems: "center",
		width: "100%"
	},
	subContainerGraph: {
		display: "flex",
		flexDirection: "column",
		justifyContent: "flex-start",
		alignItems: "start",
		width: "100%"
	},
	graphContainer: {
		display: "flex",
		paddingLeft: theme.spacing(3)
	}
}));
const defaultBlockSpecs = {
	alertType: "default",
	value: "0",
	startLabel: "$",
	label: "",
	labelVariant: "subtitle2",
	width: "100%",
	style: { border: "none" }
};
/**
* `AmbientSplitStatCard` component
*/
const AmbientSplitStatCard = (props) => {
	const $ = c(54);
	const { title, subtitle, cardsSpecs, graphTitle, graphVariant, graphSpec, style } = props;
	const classes = useStyles(props);
	let t0;
	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
		t0 = /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "xxs" });
		$[0] = t0;
	} else t0 = $[0];
	let t1;
	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
		t1 = {
			fontStyle: "normal",
			fontWeight: 500,
			fontSize: "19px"
		};
		$[1] = t1;
	} else t1 = $[1];
	let t2;
	if ($[2] !== title) {
		t2 = /* @__PURE__ */ React.createElement(Typography, {
			variant: "h6",
			style: t1
		}, title);
		$[2] = title;
		$[3] = t2;
	} else t2 = $[3];
	let t3;
	if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
		t3 = /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "nudge" });
		$[4] = t3;
	} else t3 = $[4];
	const t4 = cardsSpecs?.SummaryBlockOne || defaultBlockSpecs;
	let t5;
	if ($[5] !== t4) {
		t5 = /* @__PURE__ */ React.createElement(SummaryBlock, t4);
		$[5] = t4;
		$[6] = t5;
	} else t5 = $[6];
	let t6;
	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
		t6 = /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "xxs" });
		$[7] = t6;
	} else t6 = $[7];
	let t7;
	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
		t7 = { fontWeight: 400 };
		$[8] = t7;
	} else t7 = $[8];
	let t8;
	if ($[9] !== subtitle) {
		t8 = /* @__PURE__ */ React.createElement(Typography, {
			variant: "subtitle2",
			style: t7
		}, subtitle);
		$[9] = subtitle;
		$[10] = t8;
	} else t8 = $[10];
	let t9;
	if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
		t9 = /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "xxs" });
		$[11] = t9;
	} else t9 = $[11];
	let t10;
	if ($[12] !== classes.subContainerGraph || $[13] !== t2 || $[14] !== t5 || $[15] !== t8) {
		t10 = /* @__PURE__ */ React.createElement("div", { className: classes.subContainerGraph }, t0, t2, t3, t5, t6, t8, t9);
		$[12] = classes.subContainerGraph;
		$[13] = t2;
		$[14] = t5;
		$[15] = t8;
		$[16] = t10;
	} else t10 = $[16];
	let t11;
	if ($[17] === Symbol.for("react.memo_cache_sentinel")) {
		t11 = /* @__PURE__ */ React.createElement(Divider, { orientation: "vertical" });
		$[17] = t11;
	} else t11 = $[17];
	const t12 = cardsSpecs?.SummaryBlockTwo || defaultBlockSpecs;
	let t13;
	if ($[18] !== t12) {
		t13 = /* @__PURE__ */ React.createElement(SummaryBlock, t12);
		$[18] = t12;
		$[19] = t13;
	} else t13 = $[19];
	let t14;
	if ($[20] !== classes.divider) {
		t14 = /* @__PURE__ */ React.createElement(Divider, {
			orientation: "horizontal",
			className: classes.divider
		});
		$[20] = classes.divider;
		$[21] = t14;
	} else t14 = $[21];
	const t15 = cardsSpecs?.SummaryBlockThree || defaultBlockSpecs;
	let t16;
	if ($[22] !== t15) {
		t16 = /* @__PURE__ */ React.createElement(SummaryBlock, t15);
		$[22] = t15;
		$[23] = t16;
	} else t16 = $[23];
	let t17;
	if ($[24] !== classes.subContainer || $[25] !== t13 || $[26] !== t14 || $[27] !== t16) {
		t17 = /* @__PURE__ */ React.createElement("div", { className: classes.subContainer }, t13, t14, t16);
		$[24] = classes.subContainer;
		$[25] = t13;
		$[26] = t14;
		$[27] = t16;
		$[28] = t17;
	} else t17 = $[28];
	let t18;
	if ($[29] !== classes.infoContainer || $[30] !== t10 || $[31] !== t17) {
		t18 = /* @__PURE__ */ React.createElement("div", { className: classes.infoContainer }, t10, t11, t17);
		$[29] = classes.infoContainer;
		$[30] = t10;
		$[31] = t17;
		$[32] = t18;
	} else t18 = $[32];
	let t19;
	if ($[33] !== classes.divider) {
		t19 = /* @__PURE__ */ React.createElement(Divider, {
			orientation: "horizontal",
			className: classes.divider
		});
		$[33] = classes.divider;
		$[34] = t19;
	} else t19 = $[34];
	let t20;
	if ($[35] === Symbol.for("react.memo_cache_sentinel")) {
		t20 = /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "nudge" });
		$[35] = t20;
	} else t20 = $[35];
	let t21;
	if ($[36] !== graphTitle) {
		t21 = /* @__PURE__ */ React.createElement(Typography, { variant: "subtitle1" }, graphTitle);
		$[36] = graphTitle;
		$[37] = t21;
	} else t21 = $[37];
	let t22;
	if ($[38] === Symbol.for("react.memo_cache_sentinel")) {
		t22 = /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "nudge" });
		$[38] = t22;
	} else t22 = $[38];
	let t23;
	if ($[39] !== classes.graphContainer || $[40] !== t21) {
		t23 = /* @__PURE__ */ React.createElement("div", { className: classes.graphContainer }, t21, t22);
		$[39] = classes.graphContainer;
		$[40] = t21;
		$[41] = t23;
	} else t23 = $[41];
	let t24;
	if ($[42] === Symbol.for("react.memo_cache_sentinel")) {
		t24 = {
			width: "100%",
			minWidth: "100%",
			"& svg": { width: "100%" }
		};
		$[42] = t24;
	} else t24 = $[42];
	const t25 = graphVariant || "verticalBarChart";
	let t26;
	if ($[43] !== graphSpec || $[44] !== t25) {
		t26 = /* @__PURE__ */ React.createElement(Box, {
			clone: true,
			overflow: "hidden",
			sx: t24
		}, /* @__PURE__ */ React.createElement(MuiVegaLite, {
			variant: t25,
			background: "paper",
			autoResize: true,
			actions: false,
			spec: graphSpec
		}));
		$[43] = graphSpec;
		$[44] = t25;
		$[45] = t26;
	} else t26 = $[45];
	let t27;
	if ($[46] === Symbol.for("react.memo_cache_sentinel")) {
		t27 = /* @__PURE__ */ React.createElement(LayoutUnit, { unit: "xxs" });
		$[46] = t27;
	} else t27 = $[46];
	let t28;
	if ($[47] !== classes.rootContainer || $[48] !== style || $[49] !== t18 || $[50] !== t19 || $[51] !== t23 || $[52] !== t26) {
		t28 = /* @__PURE__ */ React.createElement("div", {
			className: classes.rootContainer,
			style
		}, t18, t19, t20, t23, t26, t27);
		$[47] = classes.rootContainer;
		$[48] = style;
		$[49] = t18;
		$[50] = t19;
		$[51] = t23;
		$[52] = t26;
		$[53] = t28;
	} else t28 = $[53];
	return t28;
};
//#endregion
export { AmbientSplitStatCard };

//# sourceMappingURL=AmbientSplitStatCard.mjs.map