import { FluentIconButton } from "../inputs/buttons/FluentIconButton.mjs";
import { TimeEntryStates } from "./TimeEntryStates.mjs";
import { c } from "react-compiler-runtime";
import React from "react";
import { Typography, makeStyles } from "@material-ui/core";
import { CalculatorAdditionIcon, CalculatorSubtractIcon } from "@fluentui/react-icons";
import { TimelineConnector, TimelineContent, TimelineItem, TimelineOppositeContent, TimelineSeparator } from "@material-ui/lab";
//#region src/UI/timeline/TimelineElement.jsx
const useStyles = makeStyles((theme) => ({
	root: {},
	extended: { maxWidth: 300 },
	extendedButton: {
		marginTop: theme.spacing(-1),
		marginLeft: theme.spacing(1)
	}
}));
const TimelineElement = (props) => {
	const $ = c(32);
	const { time, entry, type, demoGraph, extend, extendOne, title, biasLeft } = props;
	const classes = useStyles();
	let t0;
	if ($[0] !== classes.time || $[1] !== time) {
		t0 = /* @__PURE__ */ React.createElement(TimelineOppositeContent, null, /* @__PURE__ */ React.createElement(Typography, {
			className: classes.time,
			color: "textSecondary"
		}, time));
		$[0] = classes.time;
		$[1] = time;
		$[2] = t0;
	} else t0 = $[2];
	let t1;
	if ($[3] !== type) {
		t1 = /* @__PURE__ */ React.createElement(TimeEntryStates, { type });
		$[3] = type;
		$[4] = t1;
	} else t1 = $[4];
	let t2;
	if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
		t2 = /* @__PURE__ */ React.createElement(TimelineConnector, null);
		$[5] = t2;
	} else t2 = $[5];
	let t3;
	if ($[6] !== t1) {
		t3 = /* @__PURE__ */ React.createElement(TimelineSeparator, null, t1, t2);
		$[6] = t1;
		$[7] = t3;
	} else t3 = $[7];
	const t4 = biasLeft ? 2 : 1;
	let t5;
	if ($[8] !== t4) {
		t5 = { flex: t4 };
		$[8] = t4;
		$[9] = t5;
	} else t5 = $[9];
	let t6;
	if ($[10] !== title) {
		t6 = /* @__PURE__ */ React.createElement(Typography, { variant: "subtitle2" }, " ", title, " ");
		$[10] = title;
		$[11] = t6;
	} else t6 = $[11];
	let t7;
	if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
		t7 = {
			display: "flex",
			justifyContent: "flex-start",
			marginTop: 8
		};
		$[12] = t7;
	} else t7 = $[12];
	let t8;
	if ($[13] !== entry) {
		t8 = /* @__PURE__ */ React.createElement(Typography, null, " ", entry, " ");
		$[13] = entry;
		$[14] = t8;
	} else t8 = $[14];
	let t9;
	if ($[15] !== classes.extendedButton || $[16] !== demoGraph || $[17] !== extend || $[18] !== extendOne) {
		t9 = demoGraph && /* @__PURE__ */ React.createElement(FluentIconButton, {
			className: classes.extendedButton,
			onClick: extend,
			color: "primary",
			icon: extendOne ? CalculatorSubtractIcon : CalculatorAdditionIcon
		});
		$[15] = classes.extendedButton;
		$[16] = demoGraph;
		$[17] = extend;
		$[18] = extendOne;
		$[19] = t9;
	} else t9 = $[19];
	let t10;
	if ($[20] !== t8 || $[21] !== t9) {
		t10 = /* @__PURE__ */ React.createElement("div", { style: t7 }, t8, t9);
		$[20] = t8;
		$[21] = t9;
		$[22] = t10;
	} else t10 = $[22];
	let t11;
	if ($[23] !== demoGraph || $[24] !== t10 || $[25] !== t5 || $[26] !== t6) {
		t11 = /* @__PURE__ */ React.createElement(TimelineContent, { style: t5 }, t6, t10, demoGraph);
		$[23] = demoGraph;
		$[24] = t10;
		$[25] = t5;
		$[26] = t6;
		$[27] = t11;
	} else t11 = $[27];
	let t12;
	if ($[28] !== t0 || $[29] !== t11 || $[30] !== t3) {
		t12 = /* @__PURE__ */ React.createElement(TimelineItem, null, t0, t3, t11);
		$[28] = t0;
		$[29] = t11;
		$[30] = t3;
		$[31] = t12;
	} else t12 = $[31];
	return t12;
};
//#endregion
export { TimelineElement as default };

//# sourceMappingURL=TimelineElement.mjs.map