import { c } from "react-compiler-runtime";
import React from "react";
import { Badge, makeStyles } from "@material-ui/core";
import clsx from "clsx";
//#region src/layout/LayoutUnit.tsx
const useStyles = makeStyles((theme) => ({
	highlight: {
		background: "pink",
		opacity: (props) => props.highlight ? .2 : 0
	},
	nudge: { height: theme.spacing(1) },
	xxs: { height: theme.spacing(2) },
	xs: { height: theme.spacing(3) },
	sm: { height: theme.spacing(4) },
	md: { height: theme.spacing(5) },
	lg: { height: theme.spacing(8) },
	xl: { height: theme.spacing(12) },
	xxl: { height: theme.spacing(20) }
}));
const LayoutUnit = (props) => {
	const $ = c(64);
	const classes = useStyles(props);
	let spaceUnit;
	const { unit, highlight } = props;
	bb0: switch (unit) {
		case "nudge": {
			let t0;
			if ($[0] !== classes.highlight || $[1] !== classes.nudge) {
				t0 = clsx(classes.nudge, classes.highlight);
				$[0] = classes.highlight;
				$[1] = classes.nudge;
				$[2] = t0;
			} else t0 = $[2];
			let t1;
			if ($[3] !== highlight) {
				t1 = highlight && /* @__PURE__ */ React.createElement(Badge, {
					color: "secondary",
					badgeContent: "Nudge"
				});
				$[3] = highlight;
				$[4] = t1;
			} else t1 = $[4];
			let t2;
			if ($[5] !== t0 || $[6] !== t1) {
				t2 = /* @__PURE__ */ React.createElement("div", { className: t0 }, t1);
				$[5] = t0;
				$[6] = t1;
				$[7] = t2;
			} else t2 = $[7];
			spaceUnit = t2;
			break bb0;
		}
		case "xxs": {
			let t0;
			if ($[8] !== classes.highlight || $[9] !== classes.xxs) {
				t0 = clsx(classes.xxs, classes.highlight);
				$[8] = classes.highlight;
				$[9] = classes.xxs;
				$[10] = t0;
			} else t0 = $[10];
			let t1;
			if ($[11] !== highlight) {
				t1 = highlight && /* @__PURE__ */ React.createElement(Badge, {
					color: "secondary",
					badgeContent: "XXS"
				});
				$[11] = highlight;
				$[12] = t1;
			} else t1 = $[12];
			let t2;
			if ($[13] !== t0 || $[14] !== t1) {
				t2 = /* @__PURE__ */ React.createElement("div", { className: t0 }, t1);
				$[13] = t0;
				$[14] = t1;
				$[15] = t2;
			} else t2 = $[15];
			spaceUnit = t2;
			break bb0;
		}
		case "xs": {
			let t0;
			if ($[16] !== classes.highlight || $[17] !== classes.xs) {
				t0 = clsx(classes.xs, classes.highlight);
				$[16] = classes.highlight;
				$[17] = classes.xs;
				$[18] = t0;
			} else t0 = $[18];
			let t1;
			if ($[19] !== highlight) {
				t1 = highlight && /* @__PURE__ */ React.createElement(Badge, {
					color: "secondary",
					badgeContent: "XS"
				});
				$[19] = highlight;
				$[20] = t1;
			} else t1 = $[20];
			let t2;
			if ($[21] !== t0 || $[22] !== t1) {
				t2 = /* @__PURE__ */ React.createElement("div", { className: t0 }, t1);
				$[21] = t0;
				$[22] = t1;
				$[23] = t2;
			} else t2 = $[23];
			spaceUnit = t2;
			break bb0;
		}
		case "sm": {
			let t0;
			if ($[24] !== classes.highlight || $[25] !== classes.sm) {
				t0 = clsx(classes.sm, classes.highlight);
				$[24] = classes.highlight;
				$[25] = classes.sm;
				$[26] = t0;
			} else t0 = $[26];
			let t1;
			if ($[27] !== highlight) {
				t1 = highlight && /* @__PURE__ */ React.createElement(Badge, {
					color: "secondary",
					badgeContent: "SM"
				});
				$[27] = highlight;
				$[28] = t1;
			} else t1 = $[28];
			let t2;
			if ($[29] !== t0 || $[30] !== t1) {
				t2 = /* @__PURE__ */ React.createElement("div", { className: t0 }, t1);
				$[29] = t0;
				$[30] = t1;
				$[31] = t2;
			} else t2 = $[31];
			spaceUnit = t2;
			break bb0;
		}
		case "md": {
			let t0;
			if ($[32] !== classes.highlight || $[33] !== classes.md) {
				t0 = clsx(classes.md, classes.highlight);
				$[32] = classes.highlight;
				$[33] = classes.md;
				$[34] = t0;
			} else t0 = $[34];
			let t1;
			if ($[35] !== highlight) {
				t1 = highlight && /* @__PURE__ */ React.createElement(Badge, {
					color: "secondary",
					badgeContent: "MD"
				});
				$[35] = highlight;
				$[36] = t1;
			} else t1 = $[36];
			let t2;
			if ($[37] !== t0 || $[38] !== t1) {
				t2 = /* @__PURE__ */ React.createElement("div", { className: t0 }, t1);
				$[37] = t0;
				$[38] = t1;
				$[39] = t2;
			} else t2 = $[39];
			spaceUnit = t2;
			break bb0;
		}
		case "lg": {
			let t0;
			if ($[40] !== classes.highlight || $[41] !== classes.lg) {
				t0 = clsx(classes.lg, classes.highlight);
				$[40] = classes.highlight;
				$[41] = classes.lg;
				$[42] = t0;
			} else t0 = $[42];
			let t1;
			if ($[43] !== highlight) {
				t1 = highlight && /* @__PURE__ */ React.createElement(Badge, {
					color: "secondary",
					badgeContent: "LG"
				});
				$[43] = highlight;
				$[44] = t1;
			} else t1 = $[44];
			let t2;
			if ($[45] !== t0 || $[46] !== t1) {
				t2 = /* @__PURE__ */ React.createElement("div", { className: t0 }, t1);
				$[45] = t0;
				$[46] = t1;
				$[47] = t2;
			} else t2 = $[47];
			spaceUnit = t2;
			break bb0;
		}
		case "xl": {
			let t0;
			if ($[48] !== classes.highlight || $[49] !== classes.xl) {
				t0 = clsx(classes.xl, classes.highlight);
				$[48] = classes.highlight;
				$[49] = classes.xl;
				$[50] = t0;
			} else t0 = $[50];
			let t1;
			if ($[51] !== highlight) {
				t1 = highlight && /* @__PURE__ */ React.createElement(Badge, {
					color: "secondary",
					badgeContent: "XL"
				});
				$[51] = highlight;
				$[52] = t1;
			} else t1 = $[52];
			let t2;
			if ($[53] !== t0 || $[54] !== t1) {
				t2 = /* @__PURE__ */ React.createElement("div", { className: t0 }, t1);
				$[53] = t0;
				$[54] = t1;
				$[55] = t2;
			} else t2 = $[55];
			spaceUnit = t2;
			break bb0;
		}
		case "xxl": {
			let t0;
			if ($[56] !== classes.highlight || $[57] !== classes.xxl) {
				t0 = clsx(classes.xxl, classes.highlight);
				$[56] = classes.highlight;
				$[57] = classes.xxl;
				$[58] = t0;
			} else t0 = $[58];
			let t1;
			if ($[59] !== highlight) {
				t1 = highlight && /* @__PURE__ */ React.createElement(Badge, {
					color: "secondary",
					badgeContent: "XXL"
				});
				$[59] = highlight;
				$[60] = t1;
			} else t1 = $[60];
			let t2;
			if ($[61] !== t0 || $[62] !== t1) {
				t2 = /* @__PURE__ */ React.createElement("div", { className: t0 }, t1);
				$[61] = t0;
				$[62] = t1;
				$[63] = t2;
			} else t2 = $[63];
			spaceUnit = t2;
			break bb0;
		}
		default:
	}
	return spaceUnit;
};
//#endregion
export { LayoutUnit };

//# sourceMappingURL=LayoutUnit.mjs.map